Designs | Resume | KamranAyub.com | email: ayubx003 (@umn.edu)

« How To: Read RSS/Atom Feed Using .NET and the XmlDataSource With Or Without Namespaces [Coding] | Main | Amazon Daily Deal and Friday 5 for 5 [Aphex Twin] »

Fix: Suckerfish IE7 Disappear/Sticky Bug [Yay!] | Posted at 11:50 PM

After searching Google and reading comments, I could not find a solution to a problem I had while using the Sons of Suckerfish drop-down menu.

My problem was not only that the drop down stuck when you clicked somewhere first, but also the drop down would disappear when I got past a certain point (probably the height of the containing <li>).

Here’s how I fixed it:

ul#nav li:hover div, ul#nav li.over div

{

    left:0;

    zoom:1; /* fix ie7 disappear */

}

ul#nav li:hover, ul#nav li.over

{

    height:auto; /* fix ie7 sticky */

}


Note that I have a containing <div> within the <li> element. That is because my drop-downs are a bit more customized with headings, background, etc. Just change "div"? to "ul"? if you just have a <ul> inside the <li>. Note I also use "left:0"? because the containing list element aligns text to the center, so an auto left margin centers the drop down which isn’t what I want.

Thanks to css-class.com for their list of fixes. This works in all browsers I own.

Tested in: Firefox 2+, IE6+, Safari 3, and Opera 9

Filed Under: Tips and Tricks Web & Internet

Post a comment