Internet Explorer z-index bug suckerfish dropdown

I have a valid XHTML 1.0 Strict document at http://ecommercetotal.co.uk/menutest/

I have a problem in IE 6+7, which is that I have a div called loginbar with a background and 2 normal images that say login and register in that div
When the home anchor is hovered the login bar should be completly hidden from view but the login and register images are displayed on top of the horizontal dropdown menu.

Any advice would save me a huge headache?

The trouble is not that it's being 'hidden', but that in actual fact it's not working at all!

IE6 ignores the :hover pseudo-class on elements other than <a>. You need to use a spot of javascript.

Make sure you're using the Son of Suckerfish dropdowns, which are in improvement on code and browser compatibility compared to the original Suckerfish.

It's also got the script you need to ensure you get it working in IE6

HTH

You are absolutely right.

After further investigation I found the line

Code: Select all

#nav li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
    top: auto;
    left: auto;
}

was giving me problems in IE7