View Full Version : Div's with background images stretching 100% of the width of the page

05-30-2012, 02:47 AM
Hey everyone, I have been struggling with this and have yet to find out where I've screwed it up..

Here's the live site:

Here's the problem:
If you look at the site, there is almost a 5px white border all the way around the site -- IE: in the header, you see that the black isn't 100% stretched, and same thing in the footer.

CSS Code:

body{font: 12px Times, Arial, Tahoma; color: #323232; background: #f7f7f7;}
.bgTop{background: url(../images/bg_header.jpg) repeat-x; height:107px;}
.bgBottom{background: url(../images/bgBottom.png) repeat-x; height:139px;}
/*.container_24{background: url(../images/24_col.gif); height: 1000px;}*/

.header{color: #fff;height:107px;}
.logo{margin-left:13px; cursor: pointer;}
.logo img{border:0px;}
.nav ul{}
.nav ul li{display: inline;}
.nav ul li a{color: #fff; float:left; display:block; padding: 0 14px; height:66px; line-height:66px; cursor: pointer;}
.nav ul li a:hover{text-decoration: underline;}

.footerText{height: 88px;}

.footer ul{}
.footer ul li{display:inline;}
.footer ul li:first-child a{border-left:none;}
.footer ul li a{font-size:14px; display:block; color: #fff; float:left; cursor: pointer; padding: 0 5px; border-left: 1px solid #ababab;}

I used a very similar code for a separate website (http://rxexpressofmilton.com/index2.php) which stretches completely..

Any idea on where I goofed at?


05-30-2012, 06:48 AM
Try giving css reset

05-30-2012, 06:54 AM
Miraculously, I added "margin:0; padding:0; to my body tags and it worked..