Guten Abend,
ich habe ein Problem mit meinem Drop-Down-Menü. Im Firefox funktioniert es perfekt, nur im Internet Explorer will es nicht aufklappen. Ich habe keine Ahnung was ich falsch gemacht habe :/
Hier erstmal mein Code:
Ich hoffe, ihr könnt mir weiter helfen :)
Alles Liebe,
Slayour.
EDIT:
hat sich geklärt. für alle mit dem selben problem, denkt dran, im internet-explorer braucht ihr, wenn ihr :hover auf andere elemente außer a verwendet, eine richtige doctype, nicht so fehlerhaft wie meine.. ich hab die genommen und damit geht es: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
ich habe ein Problem mit meinem Drop-Down-Menü. Im Firefox funktioniert es perfekt, nur im Internet Explorer will es nicht aufklappen. Ich habe keine Ahnung was ich falsch gemacht habe :/
Hier erstmal mein Code:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Lichtechnik</title>
<meta name="" content="anonym">
<style type="text/css">
body {
text-align:center;
background:#171717;
}
* {
margin: 0;
padding: 0;
}
#menu {
background:#D0D0D0;
font-family: Verdana;
font-size: 1em;
line-height: 1.5;
float: left;
text-align:center;
}
#menu ul {
float: left;
width: 150px;
list-style-type: none;
}
/*--definiert die Blocküberschriften--*/
#menu h3 {
font-size: 1em;
text-align: center;
color: #000;
border: 1px solid #003366;
background: #ff8000;
}
/*--definiert die "Drop-Down-Links" im Normalzustand--*/
#menu a {
text-decoration: none;
display: block;
border: 1px solid #ccc;
text-align: center;
background: #ff9224;
color: #003366;
}
/*--definiert die "Drop-Down-Links" im Hoverzustand--*/
#menu a:hover {
color: #ff9224;
background: #003366;
}
/*verhindert im Zusammenhang mit position absolute bei ul ul
*eine Höhenvergrößerung von #menu beim Hovern--
*/
#menu li {
position: relative;
}
/*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/
#menu ul ul {
position: absolute;
z-index: 2;
display: none;
}
/*--lässt die Dropdown-Links beim Hovern erscheinen--*/
#menu ul li:hover ul {
display: block;
}
/*--nur für IE-Versionen <=6 erkennbar--*/
* html #menu ul li {
float: left;
width: 100%;
}
/*--nur für IE 7 erkennbar--*/
*+ html #menu ul li {
float: left;
width: 100%;
}
*html #menu ul li a {
height: 1%;
}
/*-- lässt die dritte Ebene verschwinden--*/
#menu ul li:hover ul ul {display: none;}
/*-- lässt die dritte Ebene beim Hovern über die zweite in Erscheinung treten--*/
div#menu ul ul li:hover ul {display: block; position: absolute; top: 0; left: 100%;}
#block {
background:#D1D1D1;
margin-top:3%;
margin-bottom:5%;
width:905px;
border: 2px solid black;
text-align:center;
}
</style>
</head>
<body>
<center>
<div id="block">
<img id="head" alt="" src="Bilder/head.jpg">
<center>
<div id="menu">
<ul>
<li>
<h3>Home</h3>
</li>
</ul>
<ul>
<li>
<h3>Profil</h3>
<ul>
<li><a href="#">Geschichte</a></li>
<li><a href="#">Mitarbeiter</a></li>
<li><a href="#">Vorstand</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h3>Angebot</h3>
<ul>
<li><a href="#">Glühbirnen</a></li>
<li><a href="#">Laser</a></li>
<li><a href="#">Taschenlampen</a></li>
<li><a href="#">Einbau</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h3>Referenzen</h3>
<ul>
<li><a href="#">Diskotheken</a></li>
<li><a href="#">Bars</a></li>
<li><a href="#">Restaurants</a></li>
<li><a href="#">Hotels</a></li>
<li><a href="#">Museen</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h3>Support</h3>
<ul>
<li><a href="#">FAQ</a></li>
<li><a href="#">Anrufen</a></li>
<li><a href="#">E-Mail</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<h3>Partner</h3>
<ul>
<li><a href="#">Die Krosse Krabbe</a></li>
<li><a href="#">Kunstgallerie</a></li>
<li><a href="#">Partykeller</a></li>
</ul>
</li>
</ul>
</div>
</center>
<div style="clear: both;">
</div>
<img src="Bilder/girlande.gif" alt="" border="0" width="" height="">
</br>
<div id="inhalt">
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
<hr id="schlussstrich">
<p id="fussleiste"><a href="">Impressum</a> | <a href="">AGB</a> | <a href="">Kontakt</a></p>
</div>
</center>
</body>
</html>Alles Liebe,
Slayour.
EDIT:
hat sich geklärt. für alle mit dem selben problem, denkt dran, im internet-explorer braucht ihr, wenn ihr :hover auf andere elemente außer a verwendet, eine richtige doctype, nicht so fehlerhaft wie meine.. ich hab die genommen und damit geht es: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Zuletzt bearbeitet:
