ie and firefox

[chriscloyd]

can some one help me

i have this site im working on

and in firefox it works fine

but in ie the dropdown menu goes to the right

 

chriscloyd.vndv.com

[Cetanu]

CSS and HTML code please?

[chriscloyd]

html

<!--Start Nav Bar-->
<div id="nav_bar"><li><a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu1');MM_swapImage('Image1','','Images/nav_bar_hover_1.png',1)"><img src="Images/nav_bar_1.png" name="Image1" width="120" height="44" border="0" id="Image1" /></a><div id="menu1" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()"><div id="lou"><a href="#">Senior Photography</a></div><div id="lou"><a href="#">Business Photography</a></div><div id="lou"><a href="#">Family Photography</a></div><div id="lou"><a href="#">Preschool Photography</a></div><div id="lou"><a href="#">Make an Appointment</a></div><div id="lou"><a href="#">Retakes</a></div></div></li><li><a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu2');MM_swapImage('Image2','','Images/nav_bar_hover_2.png',1)"><img src="Images/nav_bar_2.png" name="Image2" width="193" height="43" border="0" id="Image2" /></a><div id="menu2" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()"><div id="sports"><a href="#">Link Here</a></div><div id="sports"><a href="#">Link Here</a></div><div id="sports"><a href="#">Link Here</a></div><div id="sports"><a href="#">Link Here</a></div></div></li><li><a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu3');MM_swapImage('Image3','','Images/nav_bar_hover_3.png',1)"><img src="Images/nav_bar_3.png" name="Image3" width="140" height="43" border="0" id="Image3" /></a><div id="menu3" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()"><div id="schools"><a href="#">Link Here</a></div><div id="schools"><a href="#">Link Here</a></div><div id="schools"><a href="#">Link Here</a></div><div id="schools"><a href="#">Link Here</a></div></div></li><li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','Images/nav_bar_hover_4.png',1)"><img src="Images/nav_bar_4.png" name="Image4" width="110" height="43" border="0" id="Image4" /></a></li><li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Images/nav_bar_hover_5.png',1)"><img src="Images/nav_bar_5.png" name="Image5" width="122" height="43" border="0" id="Image5" /></a></li><li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','Images/nav_bar_hover_6.png',1)"><img src="Images/nav_bar_6.png" name="Image6" width="147" height="43" border="0" id="Image6" /></a></li><li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('image7','','Images/nav_bar_hover_7.png',1)"><img src="Images/nav_bar_7.png" name="image7" width="58" height="43" border="0" id="image7" /></a></li><li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','Images/nav_bar_hover_8.png',1)"><img src="Images/nav_bar_8.png" name="Image8" width="110" height="43" border="0" id="Image8" /></a></li></div>
<!--End Nav Bar-->

 

css

#menu1 {
position:absolute;
visibility:hidden;
z-index: 5;
}
#menu2 {
position:absolute;
visibility:hidden;
z-index: 5;
}
#menu3 {
position:absolute;
visibility:hidden;
z-index: 5;
}
#lou a {
background-color:#fdb6b3;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
}
#lou a:hover {
background-color:#d6edf5;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
filter: alpha (opacity=50);
}
#sports a {
background-color:#a3b4de;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
filter: alpha (opacity=50);
}
#sports a:hover {
background-color:#d6edf5;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
filter: alpha (opacity=50);
}
#schools a {
background-color:#acdf98;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
}
#schools a:hover {
background-color:#d6edf5;
border-bottom-color:#b9b99d;
border-bottom-style:solid;
border-bottom-width:1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #848482;
padding: 5px;
display: block;
}

[chriscloyd]

here this is probably easier to look at

<html>
<!--Start Nav Bar-->
<div id="nav_bar">
<li>
	<a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu1');MM_swapImage('Image1','','Images/nav_bar_hover_1.png',1)"><img src="Images/nav_bar_1.png" name="Image1" width="120" height="44" border="0" id="Image1" /></a>
	<div id="menu1" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()">
		<div id="lou"><a href="#">Senior Photography</a></div>
		<div id="lou"><a href="#">Business Photography</a></div>
		<div id="lou"><a href="#">Family Photography</a></div>
		<div id="lou"><a href="#">Preschool Photography</a></div>
		<div id="lou"><a href="#">Make an Appointment</a></div>
		<div id="lou"><a href="#">Retakes</a></div>
	</div>
</li>
<li>
	<a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu2');MM_swapImage('Image2','','Images/nav_bar_hover_2.png',1)"><img src="Images/nav_bar_2.png" name="Image2" width="193" height="43" border="0" id="Image2" /></a>
	<div id="menu2" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()">
		<div id="sports"><a href="#">Link Here</a></div>
		<div id="sports"><a href="#">Link Here</a></div
		<div id="sports"><a href="#">Link Here</a></div>
		<div id="sports"><a href="#">Link Here</a></div>
	</div
</li>
<li>
	<a href="#" onmouseout="mclosetime();" onmouseover="mopen('menu3');MM_swapImage('Image3','','Images/nav_bar_hover_3.png',1)">
	<img src="Images/nav_bar_3.png" name="Image3" width="140" height="43" border="0" id="Image3" /></a>
	<div id="menu3" style="top:163px;" onmouseover="mcancelclosetime()" onmouseout="mclosetime();MM_swapImgRestore()">
		<div id="schools"><a href="#">Link Here</a></div>
		<div id="schools"><a href="#">Link Here</a></div>
		<div id="schools"><a href="#">Link Here</a></div>
		<div id="schools"><a href="#">Link Here</a></div>
	</div>
</li>
<li>
	<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','Images/nav_bar_hover_4.png',1)"><img src="Images/nav_bar_4.png" name="Image4" width="110" height="43" border="0" id="Image4" /></a>
</li>
<li>
	<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Images/nav_bar_hover_5.png',1)"><img src="Images/nav_bar_5.png" name="Image5" width="122" height="43" border="0" id="Image5" /></a>	
</li>
<li>
	<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','Images/nav_bar_hover_6.png',1)"><img src="Images/nav_bar_6.png" name="Image6" width="147" height="43" border="0" id="Image6" /></a>	
</li>
<li>
	<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('image7','','Images/nav_bar_hover_7.png',1)"><img src="Images/nav_bar_7.png" name="image7" width="58" height="43" border="0" id="image7" /></a>
</li>
<li>
	<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','Images/nav_bar_hover_8.png',1)"><img src="Images/nav_bar_8.png" name="Image8" width="110" height="43" border="0" id="Image8" /></a>
</li>
</div>
<!--End Nav Bar-->
</html>

[rachelk]

It could be the script you're using for your menu that's controlling that and not the css itself.. if you can't get it fixed you could try another script, this one looks like it does what yours does and looks the same in both IE and Firefox: http://www.dynamicdrive.com/dynamicindex1/dropdowncontrol.htm