Задать вопрос
@vetsmen
html

Почему не обрабатывается height: 100%?

Доброго времени суток. Есть такая структура:
<body>
	<div class="wrap">
		<div class="sidebar"></div>
		<div class="main"></div>
	</div>
</body>

И такие стили:
.sidebar { width: 214px; height: 100%; display: inline-block; float: left; }
.main { width: 100%; height: 100%; float: left;}


Однако height: 100% не обрабатывается нигде, показывает высоту, равную нулю. height: 100% указывал так же к .wrap и к html. В чем проблема и как избежать данной ситуации? Спасибо.
  • Вопрос задан
  • 302 просмотра
1 комментарий
Подписаться 1 Простой 1 комментарий
Решения вопроса 3
Odisseya
@Odisseya
Оптимизирую PageSpeed & Performance
Если вам нужно height: 100% от высоты окна (вьюпорта браузера), то можно использовать:
height: 100vh;
Ваш пример.
Ответ написан
Комментировать
Комментировать
amexlar
@amexlar
А так?
html, body {
    height: 100%;
}
Ответ написан
Комментировать
Комментировать
@ZaurK
Вот так работает
html,
body,
.wrap,
.sidebar,
.main{
  height: 100%;
}
Ответ написан
4 комментария
4 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
WordPress-разработчик
div. • Ставрополь
от 50 000 до 120 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Перерисовать логотип в векторе
22 нояб. 2024, в 00:55
500 руб./за проект
Разработка алгоритма на python (Data engineering)
21 нояб. 2024, в 23:30
300000 руб./за проект
Верстка Flutter + API
21 нояб. 2024, в 22:21
3000 руб./в час
Ещё заказы