I have a design where the content is fixed width, centered, but the background spans across the entire width of the browser. I'm trying to determine which approach to take when implementing this.

Example 1 (traditional implementation):

For the example below, the background of the (1) header is white, (2) horizontal menu is blue-black, and (3) main section is grey:



The above example takes uses a single body background, with fixed height headers.

Example 2 (unconventional implementation):

http://acquia.com's header has a white background and the main body section is blue. That is implemented with the main section preceding the header in HTML, and the header is placed at the top of the page using css [CODE]position:absolute;[/CODE].



Any thoughts on the advantages/drawbacks of one approach vs the other?

My take:

- the unconventional approach is less accessibility friendly, however it might adapt better across browsers
- it might also be more SEO friendly?