Simple problem:
By default, for example, when I have a file like this:
<html>
<div style="backgroundcolor:red;height:25px;width:100%;">
</div>
</html>
I get a div that has margins of about 10px from the edges of the window - there is white space that basically cannot be filled even with text.
But when I do this:
<html>
<div style="backgroundcolor:red;height:25px;width:100%;position:absolute;top:0;left:0;">
</div>
</html>
I have it touching the edges of the window - no white space.
I want to get rid of the white space because I have a centered window that grows to 100% width and because of the invisible margin on the left, it extends farther to the right and causes the white space on both sides to be asymmetrical.
I don't want to use absolute positioning because the div I am expanding is centered, and absolute positioning in general is pretty messy.
The
bodyelement (which is present whether you explicitly include it or not) typically has a default margin applied to it, which can be removed with this CSS:body { margin: 0; }You should also start your source with a doctype declaration, such as
<!doctype html>, and ensure your HTML is valid, as well as your CSS.