CSS CSS Layout Basics Getting Started with CSS Layout Centering Page Content and Creating a Full-width Header

Why is the width of the header and footer automatically 100%?


1 Answer

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 87,406 Points

Hi Nathaniel,

The body is the root element of a HTML document and by definition takes up the entire screen (or width of the browser).

If your element is a block level element then automatically it takes up the width of it's containing element, which could be the body, i.e. the root element. A width of 100% is the same as taking up the full width of the containing element.

I hope this answers your question. :)