Высота первой секции через height или content + padding?

Question

[Дядя Толя]

Всем привет! Вот есть первая секция (hero section).
Сверху header, ниже hero, в данном случае можно не париться и просто задавать фикс. высоту и дальше уже в медиа менять её на разных брейкпоинтах? Или же вы зачастую добавляете нужную высоту по макету за счет padding? Просто поделитесь своим опытом и что является хорошей практикой?

С большинством секций данный вопрос отпадает сам по себе, но с hero зачастую сомнения как лучше реализовать.

Изображение секции

Comments

[Ankhena]

Или же вы зачастую добавляете нужную высоту по макету за счет padding?

Попробуйте подумать.
Если контента станет больше, то огромные паддинги такими и останутся или их нужно будет уменьшать?

И потом с другой стороны: в верстке стараются не задавать фиксированную высоту, потому что контент может измениться, шрифты рендерятся по-разному, настройки браузеров тоже могут быть затейливыми.

Итого: разумные паддинги и ограничение по высоте.

[Дядя Толя]

Ankhena, спасибо за ваш ответ.

Answer 1

[Сергей delphinpro]

на весь экран что ли?
ну так 100vh

Comments

[Дядя Толя]

про 100vh в курсе.
я имею ввиду когда секция занимает достаточно много пространства, а контент внутри не много.
остается много лишнего пространства. вы это пространство создаете за счет padding или просто ставите фикс высоту или min-height? к примеру, если контент не планируется меняться.

[Сергей delphinpro]

Дядя Толя, паддинги по любому нужны, но не большие, а так чтобы контент не прилипал к границам. А основную высоту через min-height

[Сергей delphinpro]

даже если контент не планирует меняться сейчас.

[Дядя Толя]

Сергей delphinpro, спасибо за ваши ответы. Действительно, я забыл про min-height... это как раз то, что решает некоторые мои вопросы.

Answer 2

[Герман Зуяков]

<div class="hero">
Some content
</div>

.hero{
      height: 100vh;
       width: 100vw;