Welcome to WebmasterWorld Guest from 184.73.126.70

Forum Moderators: not2easy

Message Too Old, No Replies

Header has white spaces!

   
11:46 am on Mar 17, 2011 (gmt 0)



I've been putting together a page and I've come across and error I can't seem to resolve, when I put the banner into the header everything looks okay but when I view it in a browser I get white spaces either side of the image... any idea's?

index.php
<body>
<div id="wrapper">
<div id="container">
<div id="header"><img src="images/banner.jpg" /></div>
</div>
</div>
</body>


style.css
body {
background-image:url(../images/background.gif);
background-repeat:repeat;
}

#wrapper {
width:80%;
height:auto;
margin:0 auto;
background-color:white;
border:thin solid;
border-color:#999999;
}

#container {
width:auto;
margin:0 auto;
height:auto;
overflow:auto;
}

#header {
width:800px;
height:auto;
margin:0 auto;
text-align:center;
}
4:47 pm on Mar 17, 2011 (gmt 0)

WebmasterWorld Senior Member rocknbil is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Did you try setting margin/padding to 0 on the body?
5:03 pm on Mar 17, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



I would try using Firebug to inspect the element and see what styles and box layout were being applied.
6:03 pm on Mar 17, 2011 (gmt 0)



Unfortunately that didn't resolve the issue, I'm completely lost on this as I've never had the problem before. Everything is telling me that the header div box is wrong but I can't see why.
6:11 pm on Mar 17, 2011 (gmt 0)



Solved it! I had the wrapper set to 80% of the browsers width and the header set at 800px therefore it would always be trying to fill in the spaces when a large browser window is opened!
 

Featured Threads

Hot Threads This Week

Hot Threads This Month