two level drop down menu (ie7, hover, dom)

Hello everyone.

I have this menu working alright in FF, Opera and Safari.
http://www.clubpontelasbotas.com/test.html

My only other target is IE7, so I can live happily ignoring all the headaches from the past.

However, I am still having problems with IE... On every other browser but this one, I have a sub menu that appears under Analisis->Analisis Guardados. But in IE, it isn't showing at all.

It's correctly positioned, for what I reckon. But it is not setting the 'display:block' property when it should.

Any clues?

Many yhanks in advance,

Regards,

I.-

 

That's meant to be 'thanks', not "yhanks". No idea what a "yhank" is.

Regads,

I.-

 

You cannot have display: block/none and position: absolute in the same style rule (it's one or the other), especially with regard to dropdown menus. For IE 7, add min-height: 1%; to the nested UL (the child lists for the dropdown menus, not the top level menu) to trigger hasLayout. There's no need to hack it, just slip the property/declaration right in there.

 

Why do you say that?
I can't find anything like that in the spec... or you mean that it is proved that this combination is problematic for IE?

I see that in the original Suckerish Dropdowns (http://www.alistapart.com/articles/dropdowns/) the author puts display:none and position:absolute in the same rule without problem...

Anyway, thanks! And I'll try to use your suggestions and let you know what I find.

Anyone else wants to share some insight into this?

Regards,

I.-

 

Moved the "display:none" to this rule, so it doesn't sit together with the "position:absolute".

#navMenu li ul,
#navMenu li:hover li ul,
#navMenu li.over li ul
{
	display: none;
}

Code (markup):

Then added min-height:1% to this rule:

#navMenu li ul li ul
{
	top:0;
	left:100%;
	min-height:1%;
}

Code (markup):

But the results are the same (the dropdown works as intended up to the first level, but the second level displays only in FF/Opera/Safari; not in IE7).

Any other clues?

Thanks and regards,

I.-

 

I'll be home later today. Expect a complete rewrite from me then, and no, it won't be pleasant.

 

Hello again.

Any other clues?
Tried to change the "display" rules for "visibility" rules to see if that did the trick, but I get the same results (works in FF, doesn't in IE7).

Helpful advice would be very appreciated!

Thanks in advance.

Regards,

I.-

 

Thanks. I was trying to find this thread in my post log. Anyway, another Web designer (Paul O'Brien) found this thread while searching for something else online (I got the PM today), and had this to say about your problem:

I'm still going to rewrite it though.

 

Amazing. No 'filter' and it works like a charm.

Sometimes I feel like sending a little something to Redmond for all the joy they give us.

Thank you very much!

I'll make some experiments trying to make the transparency work despite IE resistance, but obviously is far from being essential

Regards!

I.-