@nvanyuk09

Как сделать блоки одинаковой высоты на всю площадь вьюпорта?

Цветные блоки должны занимать всю площадь окна, т.е. viewport’a. Какую им задать высоту?







.blue {
background-color: blue;
width: 50%;
float: right;
}

.orange {
background-color: orange;
float: left;
width: 33.333%;
}

.red {
background-color: red;
float: left;
width: 33.333%;
}

.violet {
background-color: darkmagenta;
float: left;
width: 33.333%;
}

.clear {
clear: both;
}

footer {
clear: both;
background-color: cyan;
}
  • Вопрос задан
  • 24 просмотра
Решения вопроса 1
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Вся высота вьюпорта это 100vh
Родителю задать высоту 100vh и display: flex.

https://jsfiddle.net/0t8gbn5u/

p.s. float для верстки перестали использовать уже очень давно.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы