Я пытаюсь установить div на определенную процентную высоту в CSS
blockquote>Процент того, что?
Чтобы установить процентную высоту, ее родительский элемент (*) должен иметь явную высоту. Это довольно очевидно, поскольку если вы оставите высоту как
auto
, блок будет занимать высоту своего содержимого ... но если сам контент имеет высоту, выраженную в процентах от родителя, который вы сделали вы немного поймаете 22. Браузер отбрасывает и просто использует высоту содержимого.Итак, родительский элемент div должен иметь явное свойство
height
. Хотя эта высота также может быть в процентах, если вы хотите, это просто переводит проблему на следующий уровень.Если вы хотите сделать высоту div в процентах от высоты видового экрана, каждый предок div , включая
и
, должны иметь
height: 100%
, поэтому существует цепочка явных процентных высот до div.(*: или, если div находится, «содержащий блок», который также является ближайшим предком.)
В качестве альтернативы, все современные браузеры и IE> = 9 поддерживают новые единицы CSS относительно высоты окна просмотра (
vh
) и ширины окна просмотра (vw
):div { height:100vh; }
См. здесь для больше информации .