CSS Dropdown Menü Probleme mit IE 7

Hallo,

ich habe im IE7 bei einem Dropdown Menü große Probleme…
Der IE7 macht die Untermenüs einfach nicht auf!

Kann mir jemand dabei helfen, ich verzweifle sonst noch. Hier der Code aus dem Stylesheet:

[CODE]/* Begin Horizontal Menu */

ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}

ul.dropdown {
position: relative;
float: left;
z-index: 1;
font-weight: bold;
list-style-type: none;
}

ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
color: #000;
padding: 0px 10px;
list-style-type: none;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
background-color: #edfba8;
color: #000;
}

ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
width: 150px;
list-style-type: none;
}

ul.dropdown ul li {
float: none;
font-weight: normal;
padding: 5px 10px;
background-image: url(images/horizontal-menu/bg-horizontalmenu.png);
background-repeat: repeat;
}

ul.dropdown ul ul {
top: 1px;
left: 99%;
list-style-type: none;
}

ul.dropdown li:hover > ul {
visibility: visible;
}

ul.dropdown a:link,
ul.dropdown a:visited { color: #000; text-decoration: none; }
ul.dropdown a:hover { color: #000; }
ul.dropdown a:active { color: #ffa500; }

ul.dropdown *.dir {
padding-right: 20px;
background-image: url(images/horizontal-menu/nav-arrow-down.png);
background-position: 100% 50%;
background-repeat: no-repeat;
}

ul.dropdown-horizontal ul .dir {
padding-right: 15px;
background-image: url(images/horizontal-menu/nav-arrow-right.png);
background-position: 100% 50%;
background-repeat: no-repeat;
}
/
END Horizontal Menu */[/CODE]

große Probleme…

Welche wären das denn??

Hat er doch geschrieben.

Gruss
Elroy

:oops: Bin wohl schon etwas müde, hab mirs drei ma durchgelesen und nich gesehen…

Ja, wie schon gesagt, der IE7 macht Probleme bei der Darstellung von Untermenüs. Ich dachte zuerst es liegt am li:hover im css, aber das gilt ja wohl nur für den IE6. Jemand noch einen Tipp?

Mich irritieren diese Prozentangaben bei

left: 99%;

oder

top: 100%;

Und du gibst die Breite doppelt an:

width: 100%; width: 150px;

HTML-Code ist valide?

@threadi: danke für die Tipps, das hat schon mal grundsätzlich an der Darstellung einiges verbessert was die Untermenüs angeht in anderen Browsern. Der IE7 macht aber immer noch keine Untermenüs auf.

Hat noch jemand eine Idee?

Kannst Du mal bitte einen Link zur Seite und/oder den kompletten Quellcode (HTML + CSS) zeigen?

Ja gerne: Kaiserstuhlshop - Exzellentes fr Wein, Kche & Bar! Der Online Shop fr Korkenzieher, Kchenzubehr und Bar, Kaiserstuhlshop - Exzellentes fr Wein, Kche & Bar! Der Online Shop fr Korkenzieher, Kchenzubehr und Bar - Kaiserstuhlshop.de (Betroffenes Menü ist im Header, horizontal).

Das Menü wurde erfolgreich getestet mit Firefox 3, 4 (Mac und Win), Safari Mac
Negativ: IE 6, 7, 8 Win

Hab zwar weiterhin keinen IE hier, aber Du hast dem „ul.dropdown ul“ kein „top“ gegeben. Für den IE muss man schon sowohl eine horizontale wie auch vertikale Ausrichtung angeben. Wenn eine fehlt, verhält er sich mitunter seltsam.

Vlt. kann ja noch jemand mit einem IE etwas mehr dazu sagen.

@threadi
Danke für den Tipp. Leider hat das auch nicht geholfen!

Ich glaub, das scheitert daran:

ul.dropdown li:hover > ul {  visibility: visible; }

Meines Wissens nach können die echt alten IE´s das li:hover nicht (nur f. -Elemente), neuere Versionen scheitern immer noch gerne am „>“-child-selector.

Habs nicht getestet, aber wenn du obiges CSS mal mit

ul.dropdown li:hover * {  visibility: visible; }

ersetzt, und es dann klappt, hast du den Übeltäter gefunden.

Ob das Ergebnis dann aber wie erwünscht ist,ist fraglich.

@vast
Auch dir danke, aber schon wieder erfolglos. Bei deinem Vorschlag passiert im IE wieder nichts und bei allen anderen Browsern werden die Untermenüs der 2. Ebene dann falsch dargestellt.

Ich könnte verzweifeln… wieso kann ein IE nicht wie ein Mozilla funktioieren? :evil:

hover wird vom IE seit Version 7 für jedes Element unterstützt. Darum geht es hier also nicht. Aber eine Lösung weiß ich trotzdem noch nicht :expressionless:

Ja, das link hover problem mit IE6 ist mir bekannt, das können wir auch verschmerzen (da die Top-Elemente einen Link gesetzt haben, der alle Unterelemente auf einer separaten Seite listet). Aber dass es weder mit IE7 oder 8 geht, das verstehe ich überhaupt nicht!