Как разместить элементы используя flex-box?

Question

Не понимаю как разместить элементы правильно, чтоб еще более менее адаптивно вышло.

Вот макет:

Но я не понимаю как использовать flex-box для выравнивания по центру и по левому краю, чтоб при этом правая часть осталась пустой.

.footer{
    padding-top: 98px;
    padding-bottom: 97px;
}
.footer__btn{
    width: 136px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.footer__buttons{
    background-image: url(images/twitter.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 37px;
    height: 36px;
}
.footer__buttons2{
    background-image: url(images/facebook.png);
}
.footer__buttons3{
    background-image: url(images/paypal.png);
}
.footer__wrapper{
    display: flex;
}
.footer__item{
    font-size: 16px;
    font-family: "Lato";
    color: rgb(132, 135, 137);
    font-weight: bold;
    line-height: 1.117;
    text-align: left;  
}
.footer__item_italic{
    font-style: italic;
    font-weight: 200;
}

<footer class="footer">
        <div class="footer__wrapper">
            <ul class="footer__list">
                <li class="footer__item">AOD New York</li>
                <li class="footer__item footer__item_italic">2250 Lexington Avenue</li>
                <li class="footer__item footer__item_italic">New York, NY 10035 - [email protected]</li>
            </ul>
            <div class="footer__btn">
                <a href="#">
                    <div class="footer__buttons1 footer__buttons"></div>
                </a>
                <a href="#">
                    <div class="footer__buttons2 footer__buttons"></div>
                </a>
                <a href="#">
                    <div class="footer__buttons3 footer__buttons"></div>
                </a>
            </div>
        </div>
    </footer>

P.S. У меня подключен reset.css

БЛОГ НА HUSL

Как разместить элементы используя flex-box?

Ответы (0 шт):