PDA

View Full Version : Drop down menu - Not working in IE6



lpeek
Oct 10th, 2008, 09:33 PM
Hey Hey, I know there are always plenty of problems with IE6 but i cant seem to fix this bug no matter what i try.

I've managed to get a working dropdown menu in IE7, IE8, ff, Safari etc etc etc but in IE6 the undefined list is just as if it is a list... not set out the same way. have a look if you have IE6...

claret.users50.webfusion.co.uk

I've tried using various fixing codes around but none work, including pieces of javascript etc.

heres my css:



ul { list-style:none; padding:0px; margin:0px; }
ul li { margin:0 1px 0 0; position: relative; float:left; }
ul li ul { background-color:#e6e6e6; background-image:url(../images/dropdownbg.gif); background-repeat:repeat-x; position:absolute; top:100%; left:0px; display:none; }
ul li ul li { width:170px; padding:3px; border-top:1px #eabcbc solid; cursor:pointer; }
ul li ul li:hover { width:170px; padding:3px; border-top:1px #eabcbc solid; color:#FFFFFF; background-color:#e05151; }

ul li a { padding:3px; margin-right:30px; float:left; }
ul li a:link { font-family:Verdana, Arial; font-size:13px; color:#ffffff; text-decoration:none; }
ul li a:active { font-family:Verdana, Arial; font-size:13px; color:#ffffff; text-decoration:none; }
ul li a:visited { font-family:Verdana, Arial; font-size:13px; color:#ffffff; text-decoration:none; }
ul li a:hover { font-family:Verdana, Arial; font-size:13px; color:#dddddd; text-decoration:none; }

ul li ul li a:link { font-family:Verdana, Arial; font-size:10px; color:#bc9797; text-decoration:none; }
ul li ul li a:active { font-family:Verdana, Arial; font-size:10px; color:#bc9797; text-decoration:none; }
ul li ul li a:visited { font-family:Verdana, Arial; font-size:10px; color:#bc9797; text-decoration:none; }
ul li ul li a:hover { font-family:Verdana, Arial; font-size:10px; color:#ffffff; text-decoration:none; }

ul li:hover ul { display: block; }
ul li ul:hover ul {display:block; }


Also it does seem to struggle with keeping the dropdown open sometimes in IE7, so i must have done something wrong somewhere?

abduraooft
Oct 11th, 2008, 08:38 AM
IE6 doesn't recognise :hover pseudo on elements other than anchor(<a>). So, you'd need to to apply some javascript code to fix it for IE. See http://htmldog.com/articles/suckerfish/dropdowns/