Как сделать два одинаковых по высоте блока Bootstrap?

Если возникла необходимость сделать два или более соседних блока по одинаковыми по высоте, то есть хороший плагин, который позволяет сделать это. На практике высота будет задаваться от самого высокого блока.

Скачиваем плагин отсюда.

Подключаем его следующим образом:

Перед закрывающим тегом </head> подключим файл плагина

<script src="assets/conformity/conformity.js"></script>

Далее перед закрывающим тегом </head> пишем стили

<style>
    [class*=col-] {position: relative}
    .row-conformity .to-bottom {position:absolute; bottom:0; left:0; right:0}
    .row-centered {text-align:center}   
    .row-centered [class*=col-] {display:inline-block; float:none; text-align:left; margin-right:-4px; vertical-align:top} 
</style>

Далее перед закрывающим тегом </body>подключим скрипт

<script>
    $(document).ready(function () {
        $('.row-conformity > [class*=col-]').conformity();
        $(window).on('resize scroll', function() {
            $('.row-conformity > [class*=col-]').conformity();
        });
    });
</script>

Теперь если мы создадим конструкцию типа такой

<div class="row row-conformity">
    <div class="col-sm-4">...</div>
    <div class="col-sm-4">...</div>
    <div class="col-sm-4">...</div>
</div>

соседние блоки будут одной высоты.

Предлагаю вашему вниманию подборку интересных каналов Telegram по дизайну интерьера и архитектуре

https://tele.gg/dizain_interjera - канал практикующего дизайнера интерьера с интересными советами по ремонту и декору.

https://tele.gg/interio_inspiration - канал с ежедневной подборкой проектов интерьера для вашего вдохновения

https://tele.gg/arh_inspiration - так же подборка вдохновляющих проектов, но уже по архитектуре