Menu
In my fixed-width website, I have a layout similar to this:
<div id="wrapper">
<header>...</header>
<div id="content">...</div>
<footer>...</footer>
</div>
And my CSS is similar to this:
#wrapper {
width: 700px;
margin-left: auto;
margin-right: auto;
}
Styling the <body> tag the same way also works, and it makes my code more readable, as I have less nested <div> tags.
Is applying margins and a fixed with to the <body> a safe idea?
810
It is perfectly safe, body is an HTML element like all the others.
For your layout, you might still want to use #wrapper (seems like a fixed width layout), because you might want to set a background for body (or do something with the visible "empty" space).
76
I'm testing the width/margin/padding on these elements in IETester now with XHTML Strict doctype.
So far I have the following for <body>:
IE 5.5 - FAIL (won't set width, or background expands beyond dimensions), padding/margin OK
IE 6 - PASS
IE 7 - PASS
IE 8 - Honors width but didn't handle padding/margin perfectly
Page I'm using here
Testing with width and margin applied to html element here:
IE 5.5 - SAME, except margin/padding won't work
IE 6 - Will not honor width
IE 7 - Honors width but Will not center with display:block and margin:0 auto with width set in px.
IE 8 - Honors width but didn't handle padding/margin perfectly
When width was set to the html element in all cases, it actually rendered as if it was padding, by constraining the body element.
This was fun but I'm outta gas with this now, time to get back to actual work ;)
34
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
