Задать вопрос

Как Выровнять высоту колонок в bootstrap?

Есть несколько блоков (для примера 2) в 1 ряд:

<div class="container-fluid">
<div class="row">
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
        <div class="row">
            <div class="items item-right col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <div class="row">
                            <div
                                class="col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2 col-xs-10 col-sm-10 col-md-10 col-lg-10">
                                <div class="text-uppercase text-dark-blue">
                                    <h4>Заголовок 1</h4>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-xs-5 col-sm-2 col-md-5 col-lg-5">
                              ТУТ КАРТИНКА
                            </div>

                            <div class="col-xs-7 col-sm-10 col-md-7 col-lg-7">
                                <div class="row">
                                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                        <p>
                                      1 строка текста
                                      </p>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">
        <div class="row">
            <div class="items item-center col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <div class="row">
                            <div
                                class="col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2 col-xs-10 col-sm-10 col-md-10 col-lg-10">
                                <div class="text-uppercase text-dark-blue">
                                    <h4>Заголовок 2</h4>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-xs-5 col-sm-2 col-md-5 col-lg-5">
                                ТУТ КАРТИНКА
                            </div>

                            <div class="col-xs-7 col-sm-10 col-md-7 col-lg-7">
                                <div class="row">
                                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                        <p>
                                      Много строк текста. Много строк текста.Много строк текста.Много строк текста.
                                      </p>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>


Проблема в том, что высота блока, зависит от контента, который в нем размещается, например от высоты картинки/количества текста, как сделать так, чтобы высота блоков была такая, как наибольший по высоте блок? Т.е. чтобы все блоки в ряду были одинаковых размеров. Может быть в bootstrap есть спец. решение этой проблемы? Пробовал так: Как Выровнять высоту колонок в bootstrap?, не помогло.

Вот пример:
7730905.jpg
  • Вопрос задан
  • 4488 просмотров
Подписаться 4 Оценить Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
Решения вопроса 1
SergheySan
@SergheySan
Front-end разработчик
есть небольшой, но очень хороший jQuery plugin matchHeight
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы