IE 6 Issue. Height Property?

[iamepul]

For some odd reason the website I created http://www.estartech.net/EST/ when viewed in IE 6 shows a navy blue bar right above my menu. The menu is being virtually called into the header container. Can anyone tell me why this is occurring? I have tested the website in FF, IE7, Opera, and Safri and they all seem to be working fine.

CSS
* html{
height:1px;}

body{
background-color:#d8d8d8;
/*background-image:url(../pictures/background.jpg);*/
background-repeat:repeat-x;
margin-top:0px;
margin-left:0px;
margin-right:0px;
margin-bottom:0px;}

#container{
margin-left:auto;
margin-right:auto;
width:990px;
background-image:url(../pictures/shade.jpg);
background-repeat:repeat-y;}

#headerContainer{
height:135x;
width:930px;
margin-left:auto;
margin-right:auto;
background-color:#002664;}

#bodyContainer{
margin-left:auto;
margin-right:auto;
padding:0;
width:930px;
background-color:#FFFFFF;
clear:both;
overflow:hidden;}

#footerContainer{
margin-right:auto;
margin-left:auto;
width:930px;
height:25px;
background-image:url(../pictures/footer.jpg);
background-repeat:repeat-x;}

#bodyContainerNoMenu{
margin-left:auto;
margin-right:auto;
width:930px;
background-color:#f2f2f2;}

#flashMovie{
margin-left:auto;
margin-right:auto;}

#userContainer{
text-align:right;
margin-left:auto;
margin-right:auto;
height:15px;
width:930px;
padding:5px 30px 5px 0px;
color:#002664;
font-weight:bold;
letter-spacing:2px;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;}

#marqueeContainer{
float:right; width:220px}

#marquee{
position: relative;
width: 200px;
height: 300px;
background-color: white;
overflow: hidden;
border: 2px solid #FF5900;
padding: 2px;
padding-left: 6px;}

.marqueeTitle{color:#FFFFFF;font-weight:bold;font-size:14px;width:210px;background-color:#FF5900;padding-left:2px}

.footer{
float:none;
text-align:right;
padding:8px 10px 0px 10px;
color:#002664;
font-weight:bold;
letter-spacing:2px;
font-size:9px;
font-family:Arial, Helvetica, sans-serif;}

.horMenu{
width:930px;
background-color:#CCCCCC;}

.header{
margin-left:auto;
margin-right:auto;
height:50px;
padding-left:10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:26px;
color:#002664;
font-weight:bold;
background-image:url(../pictures/banner.jpg);
background-repeat:repeat-x;}

.headerRight{
float:right;
background-color:#002664;
width:120px;
height:20px;
color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
text-align:right;
margin-top:5px;
padding-right:10px;}

.contentImage{
color:#FFFFFF;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
width:550px;
margin:0px 0px 0px 15px;}

.servicesImage{width:930px; height:200px; background-image:url(../pictures/services.jpg)}

.porfolioImage{width:930px; height:200px; background-image:url(../pictures/portfolio.jpg)}

.careersImage{width:930px; height:200px; background-image:url(../pictures/careers.jpg)}

.aboutusImage{width:930px; height:200px; background-image:url(../pictures/aboutus.jpg)}
.industriesImage{width:930px; height:200px; background-image:url(../pictures/industries.jpg)}
.pageImage{width:930px; height:200px;}


.pageTitle{
float:left;
width:915px;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
color:#002664;
letter-spacing:5px;}

.contentTitle{
letter-spacing:1px;
font-weight:600;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
padding:0px 0px 5px 0px;}

.contentCenter{
float:left;
width:900px;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
padding:15px 15px 15px 15px;
background-image:url(../pictures/shadow.jpg);
background-repeat:repeat-x;
background-color:#FFFFFF;
clear:both;
overflow:hidden;}

.subContentContainer{border-left:1px solid #999999;border-right:1px solid #999999;border-bottom:1px solid #999999;height:200px}

.subContent{float:left;padding:10px 0 0 10px;}

.contentHome{
float:left;
width:400px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding:15px 15px 15px 15px;
height:100%;
border:1px solid yellow;}

.custLogin{
float:right;
color:#002664;
letter-spacing:2px;
font-weight:bolder;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;}

.clear{
clear:both;
height:0px;
overflow:hidden;}

.footer a:link, .footer a:visited, .footer a:active, .footer a:hover, .footer a:focus{
text-align:right;
color:#002664;
font-weight:bold;
letter-spacing:2px;
font-size:9px;
font-family:Arial, Helvetica, sans-serif;
text-decoration:none;}

.contentCenter a:link, .contentCenter a:visited, .contentCenter a:hover, .contentCenter a:focus{
text-decoration:none;
font-family:Arial;
font-size:12px;
color:#002664;}

.contentCenter a:hover{
color:#FF5900;}

.custLogin a:link, .custLogin a:visited, .custLogin a:hover, .custLogin a:focus, custLogin a:active{
text-decoration:none;
color:#002664;
font-weight:bold;
letter-spacing:2px;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;}

a:link, a:visited, a:hover, a:focus, a:active{
color:#002664;
font-family:Arial, Helvetica, sans-serif;
letter-spacing:2px;}


.servicesLeft{
float:left;
width:400px;}

.servicesRight{
margin-left:15px;
width:135x;
float:left;}

.portfolioLeft{border-left:4px solid #FF5900;border-bottom:4px solid #FF5900;width:165px;height:127px;float:left;padding:0 0 0 10px;margin:25px 0 0 75px;color:#002664;font-family:Arial, Helvetica, sans-serif;
letter-spacing:2px}

.portfolioRight{width:100px;float:left;padding:5px 5px 0 5px}

.loginImageSide{width:250px;height:400px;float:left;}

.aboutUsLeft{border-left:4px solid #FF5900;border-bottom:4px solid #FF5900;width:75px;float:left;padding-left:6px;}

.aboutUsRight{width:100px;float:left;padding:5px 5px 0 5px}

.aboutusImageSide{width:250px;height:500px;float:left;}
.aboutusContent{width:640px;float:right;letter-spacing:1px;font-size:11px;font-family:Verdana, Arial, Helvetica, sans-serif;}

.font{font-family:Verdana,Arial,Helvetica,sans-serif;letter-spacing:1px;font-size:11px}

Menu CSS
#mainMenu{
margin: 0;
padding: 0;
z-index: 30;
height:30px;
background-color:#002664;
border:1px solid #999999;
background-image:url(../pictures/nav_bg.jpg);
background-repeat:repeat-x;}

#mainMenu li{
margin: 0;
padding: 0;
list-style: none;
float: left;}

#mainMenu li a{ /*IE error when Height is added*/
position:relative;
display: block;
margin:0 0 0 0;
padding:10px 15px 5px 15px;
width:auto;
color:#FFFFFF;
text-decoration: none;
letter-spacing:2px;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
border-right:1px solid #999999;}

#mainMenu li a:hover{
background-image:url(../pictures/nav_over.jpg);
background-repeat:repeat-x;
color:#FFFFFF;}

#mainMenu div{
position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
background:#002664;
border: 1px solid white;}

#mainMenu div a{/*IE error when Height is added*/
position: relative;
display: block;
margin: 0;
padding:5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
background:#CCCCCC;
color:#002664;
font-size:10px;
border-bottom:1px solid white;}

#mainMenu div a:hover{
background-image:url(../pictures/subOver.jpg);
background-repeat:repeat-x;
color: #FFFFFF}



I'm still learning CSS and SSI.

Thanks in advance,

[Centauri]

Try adding .header img {display: block}
An image is an inline element and normally has a space below it to allow for text decenders. IE6 will expand the container to allow for this even though the height has been set (it treats "height" like "min-height). The block display removes the space.

[iamepul]

Centauri, thank you for helping me once again even though you might not know how many other times you have helped me in the past.

I am now encountering an odd background problem in Opera and Safari. I would have figured that once I figured it out in FF the other browsers would have followed suit.

Thanks in advance.