-
Gap in IE6
I'm designing a website for a school and have this strange bug in IE6.
http://dzina.co.uk/clients/elthorne/
Just under the top nav bar, there is a gap between it and the image.
This is the relevent CSS:
Code:
body {
background:#411c25;
font-family:Arial, Helvetica, sans-serif;
color:#fafafa;
margin:0;
font-size:100%; /*sets size of em at 16px*/
}
#wrapper {
width:48.75em;
margin:0 auto;
}
#topsep {
width:48.75em;
margin:0;
height:6px;
background:#6c2f3e;
background-image:url(images/navbg.gif);
background-repeat:repeat-x;
}
#nav1 {
height:1.25em;
padding:0 0.5em 0 0;
text-align:right;
color:#411c25;
line-height:1.25em;
width:48.25em;
background:#6c2f3e;
}
#nav1 a {
text-decoration:none;
color:#ffce23;
font-size:0.75em;
}
#nav1 a:hover {
background:#ffce23;
color:#6c2f3e;
}
#imagerotator {
width:48.75em;
margin:0;
height:194px;
background-image:url(images/header/test.png);
}
#logo {
height:169px;
width:135px;
margin:0 0 0 50px;
background-image:url(images/ep1.png);
}
#logo a{
display:block;
height:169px;
width:135px;
}
#logotop {
width:135px;
height:6px;
margin:0 0 0 50px;
background-image:url(images/ep2.png);
background-repeat:no-repeat;
}
HTML Code:
<div id="wrapper">
<div id="nav1">
<a href="index.php">Home</a> |
<a href="about.php">About Elthorne</a> |
<a href="sitemap.php">Site Map</a> |
<a href="contact.php">Contact</a>
</div>
<div id="topsep"><div id="logotop"></div></div>
<div id="imagerotator"><div id="logo"></div>
</div>
Any help appricated. Thanks
-
-
I've made the page white and the gap grey so it is easy to see. It is something to do with the topsep div.
Quote:
Originally Posted by
Ini
I don't see the gap..?
You're using Internet Explorer 6 right?
-
No IE7
Sorry didn't notice the 6 lol
-
Here's a screenshot for those without IE6:
http://dzina.co.uk/clients/elthorne/bar.PNG
