Unwanted Space in Divs

Morning,
I have been wrestling with this the whole morning but I can not find a solution myself or in the archives here.
In the code below, the <div class="navright"> and <div class="navleft"> displays beautifully in I.E (am using 6.0) but in Mozilla (am using 1.6) there is a gap between the header and these two divs.
I’ve tried padding, margins, absolute positioning to little success. The html and css validates. Any ideas would be most appreciated. Thanks!
[code]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

html, body {
margin:0;
padding:0;
}

#header {
height: 80px;
background-color: #10044C;
background-image: url(images/header.jpg);
background-repeat: no-repeat;
margin: 0;
clear: both;
width: 100%; /*ie requires this or height */
}

#container
{
width:700px;
margin:0px auto;
text-align:left;
padding:0px;
border: 1px solid #10044C;
background: #10044C;
background-image: none;
}

#wrapper {
width:100%;
float:left;
margin-right:-350px;
}

#contentleft {
margin-right:350px;
background: #ff4444;
padding: 0px;
margin-top: 0px;
border-right: 1px solid #000000;
border-top: 1px solid #10044C; /* to stop collapsing margins in Moz */
}

#contentright {
width: 350px;
float: right;
margin-top: 0px;
padding: 0px;
background:#ffff44;
border-top: 1px solid #10044C; /* to stop collapsing margins in Moz */
}

.navleft
{
background-image: url(images/menuleft.gif);
background-color: #1874cd;
color: #ffffff;
font-size: 65%;
font-family: verdana, arial, sans-serif;
height: 30px;
}

.navleft ul{list-style-type:none; border-left:1px solid #ffffff;}
.navleft li{display:inline; border-right:1px solid #ffffff;}
.navleft li a{text-decoration:none; color:#ffffff;}
.navleft li a:hover{color:#FA031A; text-decoration:none; font-weight:bold;}

.navright
{
background-image: url(images/menuright.gif);
background-color: #1874cd;
color: #ffffff;
font-size: 65%;
font-family: verdana, arial, sans-serif;
height: 30px;
}

.navright ul{list-style-type:none; border-left:1px solid #ffffff;}
.navright li{display:inline; border-right:1px solid #ffffff;}
.navright li a{text-decoration:none; color:#ffffff;}
.navright li a:hover{color:#FA031A; text-decoration:none; font-weight:bold;}

.entry {
color : #000000;
background: #ffffff;
background-image: none;
font-family: verdana, arial, sans-serif;
font-size: 70%;
text-align : justify;
font-weight : normal;
padding: 4px 8px 4px 8px;

}

.footer {
background: #000000;
color:#ffffff;
border-top: 2px solid #000;
border-bottom: 2px solid #000;
margin: 0;
clear: both;
width: 100%; /*ie requires this or height */
}

</style
</head>

<ul>
<li><a title="one" href="#">one</a></li>
<li><a title="two" href="#">two</a></li>
<li><a title="three" href="#">three</a></li>
<li><a title="four" href="#">four</a></li>
</ul>

</div>
<div class="entry">
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute

irure dolor in reprehenderit in voluptate velit esse molestaie cillum. Tia non ob ea soluad incommod quae egen ium improb

fugiend. Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct. Nam liber te conscient

to factor tum poen legum odioque civiuda et tam. Neque pecun modut est neque nonor et imper ned libidig met, consectetur

adipiscing elit, sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet. Duis aute in voluptate

velit esse cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent. Trenz pruca

beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar.</p>
</div>
</div>

</div>

<div id="contentright">
<div class="navright">
<ul>
<li><a title="five" href="#">five</a></li>
<li><a title="six" href="#">six</a></li>
<li><a title="seven" href="#">seven</a></li>
<li><a title="eight" href="#">eight</a></li>
</ul>

</div>
<div class="entry">
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute

irure dolor in reprehenderit in voluptate velit esse molestaie cillum. Tia non ob ea soluad incommod quae egen ium improb

fugiend. Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct. Nam liber te conscient

to factor tum poen legum odioque civiuda et tam. Neque pecun modut est neque nonor et imper ned libidig met, consectetur

adipiscing elit, sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet. Duis aute in voluptate

velit esse cillum dolore eu fugiat nulla pariatur. At vver eos et accusam dignissum qui blandit est praesent. Trenz pruca

beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar.</p>
</div>
</div>

<div class="footer">
<p>footer info</p>
</div>

</div>
</body>

</html>

[/CODE]

Unwanted Space in Divs

code works in IE but not in Mozilla

mentalacrobatics

grahamstewart

mentalacrobatics

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week