Tag Archives: how to

How to: Create Full (100%) Width Header/Footer with Centered Content (Updated)


59 Comments - LEAVE A COMMENT

Update #3 2/1/2015 – Final update! I have made the final version completely simpler and completely responsive! Disregard this version and all others. The only version you should read and download is the New Update: 100% Full Width Header & Footer with Centered Content (Including “Anchored” Versions).

Update 1/15/2012Please see the latest release of 100% Full Width Header/Footer with Centered Content.

I originally wrote a tutorial on how to “Create Full Width Header & Footer With Centered Content Using CSS” almost three years ago (yipe!) when I was working on one of the many redesigns of my site. Looking back on it now (since it’s one of my most popular articles), I see it’s slightly different as to how I have been doing it recently. Both methods work, both can be used, but I find my current method a little bit “cleaner”.