Как сделать левый div на всю высоту правого div?

Question

[Имя Имечко]

Имеется разметка

<div class="information">Красный блок</div>
<div class="content">Синий блок</div>

Как мне сделать, чтобы красный блок был по высоте схожий с синим. В синем блоке как видите будут новости (оранжевые блоки) и их может быть до 10 штук на одной странице т.е. появляется скролинг вниз т.к. будет много текста.

Answer 1

[Вадим Баяндин]

В CSS

. information {
height: 100vh;
}

Совместимость лучше уточнить, на Android есть вопросы и в старых браузерах.

Comments

[Имя Имечко]

[Имя Имечко]

Это значение тоже самое, что я бы задал фиксированную высоту блока.

[Вадим Баяндин]

Имя Имечко: или я не совсем понимаю ваш вопрос, или действительно решение для сайдбара, который будет всегда на месте, такое:
.information {
position: fixed;
height: 100vh;
}

[Имя Имечко]

Sea5calf: Нужно чтобы блок information растягивался на высоту соответствующей блоку content.
Скажем в блоке content много текста и появляется скроллинг. Так вот блок information должен растянуться на все высоту аналогичной в блоке content.

Answer 2

[Алексей Зуев]

В интернете есть куча вариантов, как сделать блоки одинаковой высоты.Хорошим решением, думаю, будет использование flex. Ваш пример

Answer 3

[Саша]

Можно сделать через табличные свойства, но могут возникнуть проблемы.
Еще вариант, задать на body красный цвет, вторая колонка будет синей, визуально эффект будет достигнут, это решение не подходит если в левой колонке контента может больше быть чем в правой.