Как выровнять по высоте текстовые блоки?

Question

[Зубков Федор]

Всем привет. На сайте tendeal.ru в блоке "Для кого" съезжают тексты “освойте новый канал”, “закроете задачи”, “поставите на автопилот” - как можно их выровнять чтобы они начинались вверху а не на разных уровнях?

Comments

[VegasChickiChicki]

Они так выравниваются из-за этого:

[Зубков Федор]

VegasChickiChicki, при отключении space-between стало еже хуже

Answer 1

[lukoie]

Этот эффект Вам дает

.sec-5 .dly-kogo .col-md-4 {
    justify-content: space-between;
}

Чтобы текст был на равном расстоянии по высоте, заголовку делайте:

h4 {
    min-height: 4rem;
}

Ну и кнопки прижимайте книзу на позишн абсолют или флексом.
А проще всего перед кнопкой вставьте дивку с классом .align-self-end, и у дивки с кнопкой класс .align-items-end
вот так:
вместо

<div class="btn-wrap"><a class="btn" href="#" data-toggle="modal" data-target="#exampleModal">
Это я
</a></div>
</div>

надо так:

<div class="col align-self-end">
<div class="btn-wrap align-items-end"><a class="btn" href="#" data-toggle="modal" data-target="#exampleModal">
Это я
</a></div>
</div>

потом проверьте это всё на мобайле только не забудьте

Answer 2

[inkShio]

Переверстай у тебя так

сделай так

на flex можно и так попробовать

еще можешь попробовать вариант с позиционированием родителю relative, заголовку absolute, а далее родителю еще указываешь padding-top в процентах.