2

Есть две дивки с разной высотой (1).
Необходимо сделать так, чтобы их высота была равна наименьшей из них (2).
Собственно возможно ли это реализовать без js? Пример

3
  • Т. е. сделать колонки равной высоты? Или куда делся кусок первой колонки на втором рисунке?
    – Qwertiy
    7 ноя 2016 в 8:09
  • Если это строчные/строчноблочные элементы, то высота будет подстраиваться под контент - что тогда делать с большим блоком? Обрезать контент? А если блочные, тогда откуда берётся ненужная бОльшая высота?
    – lexxl
    7 ноя 2016 в 8:20
  • А наименьший блок всегда разной высоты или одинаковой? Если одинаковой, то достаточно max-height. Если разной, то тут надо JS.
    – higimo
    7 ноя 2016 в 8:26

1 ответ 1

2

Можно благодаря display:flex CodePen

<div class="container">
  <div class="one"></div>
  <div class="two"></div>
</div>

.container {
  border: 5px solid red;
  display: flex;
  .one, .two {
    width:  40%;
    background: #ccc;
    margin:  10px 20px;
  } 
  .two {
    height:  400px;
  }
}

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.