问题
I'm trying to fill a certain part of the page with a background color. I want the background colour to fill the entire width of the viewport, but have a fixed height. Here's what I've tried:
<div id="theDiv" style="width: 100%; height:200px; background-color:black;">
Blah blah blah, content goes here.
</div>
But no matter what I try, this always give me a small white margin at either side of the div, between the edge of the div and the boundaries of the viewport. How can I make the div fill the entire width of the viewport?
I don't want to change the bg color of the <body> tag as I only need to fill a certain vertical section of the screen.
The only thing I can think of that I haven't tried yet is to create a 1px wide bg image and set it to x-repeat... is there not a more elegant solution than this?
回答1:
Try to set width of body and html to 100% and paddings and margins to 0.
Also you may want to apply CSS reset rules to the beginning of your style sheet. You can use this CSS reset http://meyerweb.com/eric/tools/css/reset/ or google for another one.
来源：https://stackoverflow.com/questions/11986272/cant-get-a-div-background-colour-to-fill-full-width-of-viewport