Click to See Complete Forum and Search --> : [RESOLVED] drop down menu fine in IE, not working in Firefox


shel38
04-23-2009, 11:03 AM
this is my CSS for my navigation menu #nav {
background:#51248d repeat-x;
font-size:12px;
font-family:verdana,sans-serif;
font-weight:bold;
width:100%;
}
#nav, #nav ul {
float:left;
list-style:none;
line-height:30px;
padding:0;
margin:0;
width:100%;
}
#nav a {
display:block;
color:#dddddd;
text-decoration:none;
padding:0px 15px;
}
#nav li {
float:left;
padding:0;
}
#nav ul {
position:absolute;
left:-999em;
height:auto;
width:101px;
font-weight:normal;
margin:0;
line-height:1;
border:0;
border-top:1px solid #666666;
}
#nav li li {
width:99px;
border-bottom:1px solid #666666;
border-left:1px solid #666666;
border-right:1px solid #666666;
font-weight:bold;
font-family:verdana,sans-serif;
}
#nav li li a {
padding:5px 15px;
width:80px;
font-size:12px;
color:#dddddd;
}
#nav li ul ul {
margin:-21px 0 0 100px;
}
#nav li li:hover {
background:#8d6cd1;
}
#nav li ul li:hover a, #nav li ul li li:hover a, #nav li ul li li li:hover a, #nav li ul li li li:hover a {
color:#dddddd;
}
#nav li:hover a, #nav li.sfhover a {
color:#dddddd;
}
#nav li:hover li a, #nav li li:hover li a, #nav li li li:hover li a, #nav li li li li:hover li a {
color:#dddddd;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul {
left:-999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul {
left:auto;
background:#444444;
}
#nav li:hover, #nav li.sfhover {
background:#2ba475;
}

and here is the html <div>
<ul id="nav">
<li id="active"><a href="index.html" id="current">Home</a></li>
<li id="active"><a href="findus.html">How To Find Us</a></li>
<li id="active"><a href="book.html">How To Book</a></li>
<li id="active"><a href="offers.html">Offers &amp; Promotions</a></li>
<li id="active"><a href="party.html">Party Packages</a></li>
<ul id="subnavlist">
<li id="subactive"><a href="kidsparties.html" id="subcurrent">Kids</a></li>
<li><a href="adultparties.html">Adults</a></li>
</ul>
<li id="active"><a href="leagues.html">Leagues</a></li>
<li id="active"><a href="bargrill.html">Bar &amp; Grill</a></li>
</div>

anything I can do to make the drop down menu on 'Party Packages' work in Firefox??

Any help will be very greatful,

Thanks

Fang
04-23-2009, 11:17 AM
Nest sub-menu:<ul id="nav">
<li id=""><a href="index.html" id="current">Home</a></li>
<li id=""><a href="findus.html">How To Find Us</a></li>
<li id=""><a href="book.html">How To Book</a></li>
<li id=""><a href="offers.html">Offers &amp; Promotions</a></li>
<li id="active"><a href="party.html">Party Packages</a>
<ul id="subnavlist">
<li id="subactive"><a href="kidsparties.html" id="subcurrent">Kids</a></li>
<li><a href="adultparties.html">Adults</a></li>
</ul>
</li>
<li id=""><a href="leagues.html">Leagues</a></li>
<li id=""><a href="bargrill.html">Bar &amp; Grill</a></li>
</ul>
id must be unique: http://www.w3.org/TR/REC-html40/struct/global.html#h-7.5.2

shel38
04-23-2009, 11:27 AM
thanks 4 that! i didnt no it was that easy! uve saved me hours of time! thanks so much!