dropdown menu problem on IE7

[pitagora]

I have a drop down menu that works great in every browser except IE 7 (and presumably the defunct IE 6). On IE 7 the dropdown opens in the wrong position.

This is the site: http://bit.ly/eN54Lu

If anybody could take a quick look on IE 7 or IE 8 with 7 compatibility mode enabled using the Developer Tools I’d appreciate it. I’ve already spent hours trying to fix this with no luck :(

[TheLeggett]

Hey pitagora,

A number of things here are causing this. It seems that a lot of the classes are repeated several times here (as well as many properties being redefined and overwriting each other) which makes explaining the problem a little bit tricky.

Rather than trying to piece together all the different lines from the different stylesheets, I’ve put together a demo:

/* Reset List Styles */

ul {

list-style:none;

padding:0px;

margin:0px;

}



/* Navigation */











Womens





Shop By Category



Dresses


Skirts










Shop By Brand



Brand 1


Brand 2












Mens





Shop By Category



Jeans


Shirts










Shop By Brand



Brand 1


Brand 2










On Sale


Latest News


Customer Service

I think that should do what you’re looking for adequately.

[pitagora]

Thanks. I manged to fix it following your example. Turns out that on hover the surrounding ul had position:static instead of position:relative.

Thanks again

[Author]

Posts