Равномерное растягивание div блоков при разной длины заголовков

Вывожу с помощью bootstrap 4 заголовки по 3 в ряд друг за другом. Если текст слишком длинный в одном из заголовков, то блок уходит в низ. Как сделать, чтобы они равномерно располагались, подстраивались друг под друга?введите сюда описание изображения Сейчас так

    <div class="row row-cols-1 row-cols-md-3 g-4">
    <?php if (!empty($posts)): ?>
    <?php foreach($posts as $post): ?>
    <div class="col">
        <div class="card">
            <img src="<?=$post->images?>" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title-text"><a href="<?= yii\helpers\Url::to(['view', 'id' => $post->id])?>"><?=$post->title?></a></h5>

                <p class="card-text"></p>
            </div>
        </div>
    </div>
    <?php endforeach; ?>
    <!---->
   <?php endif; ?>
</div>

.card-title-text {

    text-decoration: none;

}

.card-title-text a {
    text-decoration: none;
    color: #000;

}
.card-title-text a:hover{

    text-decoration: none;
    color: #2b2a2a;
}


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