Drop-down Menu Disappears And Comes Back Only In Ie7 Problem

I have a problem with one of my drop-down menu. Usually they work fine, but this time what happens is the following (and this is only taking place in IE7...ugh): When I put the mou

Solution 1:

When the mouse crosses a link boundary in IE6/7, it will fire an event as if your mouse left and re-entered, even if mouse is still over the same parent element (in this case the li). One workaround to avoid having the mouse "fall through" the menu is to style the menu with no gaps between <A> blocks, can you potentially adjust to make this happen?

Set background color to red on the li, and green on the a ... any red that shows through is a potential mouse event danger area for IE6/7 with this type of operation.

Solution 2:

By the way, if anyone is curious as to how I solved this problem, I used jQuery to remove the 5px margin and add some  s. This is the code I used:

$('#nav1 ul li:last').css({ 'marginRight': '-5px' }).prepend(' '); // prevents IE 7 bug

Good luck guys! Amit