Правильно ли задана высота и ширина в начальной разметке кода?

Question

[Максим Крутов]

Правильно ли я выполняю разметку в разрезе задания высоты и ширины основным элементам, чтобы в последующем вёрстка была адаптивная, и при меньшем разрешении экрана или сужении окна браузера, все блоки стали в одну колонку и не было полосы прокрутки.

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
height: 100%;
min-height: 100vh; /*Чтобы прижать footer*/
}
/*Затем для общего div в котором абсолютно весь контент*/
.wrapper{
width: 100%;
max-width: 900px; /*в зависимости от указанной ширины макета*/
}

Последующие блоки, расположенные в div с классом wrapper, такие как header, main, nav, content, menu, aside, footer, стараюсь делать с такой конструкцией:
к примеру:
main{
width: 100%;
max-width: 800px; /*относительно макета конечно*/
height: 100%;
min-height: 200px; /*также беру минимальную высоту с макета(меряю её)*/
}
И в таком ключе все оставшиеся элементы div, span и т. д. Только для header и footer просто задаю ширину 100% и всё.

В конце делаю ещё медиа-запросы, и подключаю в код css: reset.css и normalize.css.

Подскажите пожалуйста, насколько это корректно и правильно? Заранее благодарю за ответы!

Answer 1

[Даниил]

Все height: 100% очень не предсказуемы