Как растянуть блок по высоте css
Ответы
Вячеслав Межуревский
07 октября 2022
Для того, что бы растянуть блок на всю высоту страницы, можно выставить height у выбранного элемента и у всех его предков вплоть до html - 100%. Но обычно так не делают, вместо этого используются не процентные значения а, единицы относительной длины - vh и vw. Эти аббревиатуры можно расшифровать, как viewport height и viewport width — высота и ширина области просмотра соответственно. 1vh равен одному проценту от высоты области просмотра, 1vw равняется одному проценту от ширины области просмотра.
Рассмотрим пример:
<body>
<div class="all-height"></div>
</body>
Стили:
.all-height {
background-color: #38d9a9;
height: 100vh;
width: 200px;
}
При просмотре на всю высоту окна браузера будет отображена бирюзовая полоса шириной в 200px.
0
0