html - Why does adding a DOCTYPE affect my CSS? -
I'm wondering why the following html / CSS renders are not valid unless I put it in a doctype:
& lt; Body style = "margin: 0; padding: 0; background color: #eeeeee" & gt; & Lt; / Body & gt; & Lt; Div id = "header container" style = "background-color: #eeeeee; color: black; border bottom: 1px solid #cccccc; height: 60px; margin: 0 pixels" & gt; & Lt; / Div & gt; & Lt; Div style = "width: 100%; background-color: white; margin: 0 pixel; padding: 0 pixels" & gt; & Lt; Div style = "margin: 30px; width: 840px; margin: 10px auto; margin-top: 50px; background-color: #cc0000;" & Gt; Text & lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt;
What do I want a top (a gray bar) below with dark brown border below it, I want my content, which goes to a large 100% width div That's white (as the page is gray). The code above looks ok, but if I add this line to the top:
The margin goes from white to gray on the bottom, so the page looks incorrect.
Can anyone explain? I'm testing it using IE8, but it looks like one in Chrome.
Image Description:
By adding a DOCTYPE declaration, the browser has to present the page instead [approximately] in standard mode
Comments
Post a Comment