I want to create a Header with 10vh height, Main with 80vh, and Footer with 10vh with a total of 100vh. However, after setting these values in CSS the actual result is different. The header appears to be taller than the footer.
My main goal also is to create a semantic one-page html that does not create or add a scroll bar.
What is the best practice in setting the heights of header, main and footer?
I tried using dvh, % unit and max-height and min-height property to create a semantic one-page html that does not create or add a scroll bar but I can’t make it.
New contributor
Kuder is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
6