Как выравнять данные иконки?

Question

[федор unknown]

Всем привет!
Как выравнять данные иконки (икночные шрифты - facebook, youtube и т.к)
чтобы они стояли по оси X на одном линии не зависимо от количество текста

Comments

[Максим]

в фотошопе что ли ?

[федор unknown]

Много Чего, boostrap4

[Максим]

чел овек, ну тогда покажите ваш код - в песочницу куда не будь - а то ваш скриншот в аккурат предпологает что требуется фотошоп

[федор unknown]

Много Чего,

<div class="container">
        <h3 class="pt-4 pb-2">Notre Equipe</h3>
        <div class="people d-flex  md-6-50% xs-12-100% sm-8-66.6%">
            <div class="person-1 p-3">
                <img src="./images/photo-1.jpg" alt="Craig Garner CEO">
                <hr>
                <h6>Craig Garner CEO</h6>
                <hr>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, et optio aut at omnis praesentium!
                </p>
                <button type="button" class="btn btn-primary btn-sm"><i class="fab fa-facebook-square"></i> </button>
                <button type="button" class="btn btn-danger btn-sm"> <i class="fab fa-google-plus-square"></i></button>
            </div>
            <div class="person-2 p-3">
                <img src="./images/photo-2.jpg" alt="">
                <hr>
                <h6>Bridge Roberts Creative Genius</h6>
                <hr>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Id at vero quos eligendi? Exercitationem
                    culpa quibusdam nemo ea officiis voluptate?</p>
                    <button type="button" class="btn btn-primary btn-sm"><i class="fab fa-facebook-square"></i> </button>
                    <button type="button" class="btn btn-danger btn-sm"> <i class="fab fa-google-plus-square"></i></button>
            </div>
            <div class="person-3 p-3">
                <img src="./images/photo-3.jpg" alt="">
                <hr>
                <h6>Marage Garner Chef De Projet</h6>
                <hr>
                <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Error alias illum corrupti?</p>
                <button type="button" class="btn btn-danger btn-sm"><i class="fab fa-youtube-square"></i> </button>
                <button type="button" class="btn btn-primary btn-sm"> <i class="fab fa-twitter-square"></i></button>
            </div>
        </div>
    </div>

Answer 1

[mipfikus]

Контейнеру с кнопками position: absolute; и bottom: 0;
Медиа-запросы, паддинги, но у вас получится :D

Answer 2

[Aetae]

Обычный флекс, карточке flex-direction: column, последнему блоку с кнопками margin-top: auto и всё.