CSS как растянуть блок по высоте родителя

Для того, чтобы растянуть блок по высоте родителя, можно использовать свойство CSS height: 100%;. Однако, это свойство будет работать только в том случае, если у родителя задана фиксированная высота.

Если же высота родителя не задана явно, можно использовать свойство flex и его значения flex-grow и flex-shrink. Например:

.parent {
  display flex;
  flex-direction: column;
}

.child {
  flex-grow: 1;
}

В этом примере блок .parent будет отображаться как колонка, а блок .child будет растягиваться по высоте родителя.