No replies
altocss
altocss's picture
Offline
newbie
Last seen: 7 years 26 weeks ago
Timezone: GMT-5
Joined: 2013-01-16
Posts: 1
Points: 2

Hi,

I have some HTML and CSS for a dropdown menu. When I test the dropdown menu in isolation from my the rest of the webpage code it works fine in both Firefox and Internet Explorer, but when I insert this dropdown menu into the rest of my webpage code it only works in Firefox.

Does anyone know why it wouldn't show up in IE?

You'll see that the dropdown is setup for the PRODUCTS item, and that there are several other items that are just links to other parts of the site.

I know that it's not the best practice, but for testing purposes I've used both internal and inline css in my file.

Any help with this would be most appreciated!

Here's the code:

Flyout Menu

.cssfly {font-family: arial, sans-serif; width:400px; height:150px;
position:relative; margin:0;}
.cssfly ul {padding:0; margin:0; list-style-type: none; width:150px;}
.cssfly ul li {float:left; margin-right:1px; position:relative; width:150px;}
.cssfly ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000; width:164px; height:20px; text-align:left; border:1px none #fff;
border-width:1px 1px 0 0; background: #ffffff; color:#000000;
line-height:19px; font-size:13px;}
.cssfly ul li:hover a {color:#fff; background:#4F738E;}
.cssfly ul li ul {display: none; position:relative; left:160px; margin-left:10px;}
.cssfly ul li:hover ul {display:block; position:relative; left:-85px; top:3px; width:105px;}
.cssfly ul li:hover ul li a {display:block; background:#fff; color:#000; width:162px;
margin-left:-45px; margin-top:2px;}
.cssfly ul li:hover ul li a:hover {background:#ddd; color:#000; margin-left:-45px; margin-top:2px;}
.secondLevelListItems{float:left; margin-right:1px; position:relative; left:60px;}

#headerNavbarRiggingWH
{
position:absolute;
background-color:#4F738E;
left:0px;
top:108px;
width:900px;
height:43px;
margin:0px;
padding:0px;
}

#navbarListRiggingWH
{
position:absolute;
background-color:none;
left:-70px;/*was 10px*/
top:8px;
width:840px;
height:28px;
margin:0px 0px 0px 204px;
padding:0px;
}

.navbarItemRiggingWH
{
position:relative;
float:left;
display:inline;
font-size:14px;
color:#FFFFFF;
margin-top:5px;
margin-right:0px;
margin-bottom:0px;
margin-left:30px;
padding:0px;
}

#navbarAnchorRiggingWHcurrent
{
color:#000000;/* test for changing css with js */
}

#navbarAnchorRiggingWHonmouseout
{
color:#ffffff;/* test for changing css with js */
}