nicht angemeldet
Problem mit CSS-Dropdown-Menü
Hallo,
ich bekomme im IE (7) einfach kein Dropdown-Menü in CSS hin. Ich habe mir das Menü auf spiegel.de als Vorlage rausgepickt und angepasst, aber an irgend einer Stelle wohl zuviel rausgenommen. Mein Versuch funktioniert zwar im Firefox, aber im IE nicht wie gewünscht. Dort klappt sich das Untermenü sofort wieder ein, sobald ich den oberen Menüpunkt verlasse. Das Untermenü soll aber erst ausgeblendet werden, wenn ich auch das Aufklappfeld selbst verlassen habe.
Die Frage ist jetzt, warum der Firefox das wie gewünscht macht, der IE aber nicht. Ich komme einfach nicht dahinter. Vielleicht kann ja jemand helfen.
Hier der Link: http://www.fsv-optik.de/Menuetest
Und hier nochmal HTML und CSS:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>MECON Media Concept Ltd.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" media="screen" href="styles.css">
</head>
<body>
<ul class="menue">
<li class="menuepunkt"><a href="/">Home</a></li>
<li class="menuepunkt"><a href="/politik/">Saison</a>
<div class="menueDiv">
<ul class="untermenue" style="z-index:100;">
<li><a href="">Übersicht</a></li>
<li><a href="">Spielplan</a></li>
<li><a href="">Tabelle</a></li>
</ul>
</div>
</li>
</ul>
</body>
</html>
ul.menue li.menuepunkt {
float: left;
padding-right: 10px !important;
}
ul.menue li.menuepunkt .menueDiv {
position: relative;
}
ul.menue li.menuepunkt .menueDiv ul.untermenue {
list-style-type: none;
display: none;
position: absolute;
left: -40px;
z-index: 100;
padding-top: 0.07em !important;
}
ul.menue li.menuepunkt:hover ul.untermenue {
display: block;
}
/*nur Style*/
li {
list-style: none;
}
ul.menue li.menuepunkt .menueDiv ul.untermenue a,
ul.menue li.menuepunkt .menueDiv ul.untermenue a:hover {
/* text-decoration: none; */
display: block;
padding: 3px 5px !important;
min-width: 120px;
width: auto;
overflow: visible;
font-size: 0.625em;
line-height: 1.2em;
white-space: nowrap;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px dotted #CFCFCF;
color: #666;
background-color: rgb(250,250,250);
}
Besten Dank,
Onkel Schnitzel
-
Also ich habe mal auf die Spiegel Seite geschaut. Da sind auch noch diverse JavaScripts verwendet, von denen mit Sicherheit auch eines die Navigation steuert.
Wenn Du den Quelltext der Startseite anschaust findest Du mindestens einen Link auf ein externes JS. Da müsstest Du Dich durchwühlen um zu sehen, wo die entsprechende Funktionalität zu finden ist.
-
Es hat sich erstmal erledigt, weil ich doch kein Dropdown brauche. Zumindest erstmal.
Trotzdem Danke!
Also ich habe mal auf die Spiegel Seite geschaut. Da sind auch noch diverse JavaScripts verwendet, von denen mit Sicherheit auch eines die Navigation steuert.
Wenn Du den Quelltext der Startseite anschaust findest Du mindestens einen Link auf ein externes JS. Da müsstest Du Dich durchwühlen um zu sehen, wo die entsprechende Funktionalität zu finden ist.
-