Hallo Forum,
ich habe ein problem im IE6 und 7, und zwar klappt das Hauptmenü nicht in seine Untermenüs auf. im Firefox, safari, opera, IE8 klappt das ohne probleme.
Hat jeamand eine Idee woran das liegen könnte? Bin um jede hilfe dankbar, katies
Code:
#menu_p { position: absolute; left: 255px; top: 110px; }
.menu { position: relative; width: 900px; height: 0px; margin-left: 22px; top: -120px; font-family: arial, sans-serif; font-size: 0.7em; font-weight: bold; letter-spacing: 0.3em; z-index:130; color: #fff; }
.menutrenna { background-image: url(../img/menutrenn.gif); background-position: right; background-repeat: no-repeat; }
.menutrenn:hover { background-image: url(../img/roter_kristall.png); background-position: center; background-repeat: no-repeat; }
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color: #FFF; width:150px; height:70px; text-align:center; line-height: 70px; overflow:hidden; background-repeat: no-repeat; }
.menu ul {padding:0; margin:0; list-style: none; }
.menu ul li { float: left; position:relative; }
.menu ul li ul {display: none; }
.menu ul li:hover a { }
.menu ul li:hover ul {display:block; position: absolute; top:60px; background-color: #04080C; border-bottom: solid; border-color: #900; }
.menu ul li:hover ul li a {display:block; color: #900; }
.menu ul li:hover ul li a:hover {background:#; color: #F00;}
#menustyle { margin: 0px; width: 940px; height: 100px; }
#linkeecke {
float: left;
width: 22px;
height: 26px;
background-image: url(../img/menueckelinks.gif);
background-repeat: no-repeat;
background-position: bottom;
}
#oberlinie { position: relative; margin-left: 22px; width: 900px; top: 1px; height: 1px; background-image: url(../img/menulinieoben.jpg); background-repeat: no-repeat; }
#mitte { margin-left: 22px width: 880px; height: 26px; background-image: url(../img/menuhintergrund.gif); }
#rechteecke {
float: right;
width: 20px;
height: 26px;
background-image: url(../img/menueckerechts.jpg);
background-position: bottom;
background-repeat: no-repeat;
}
#unterlinie { width: 940px; height: 3px; background-image: url(../img/menulinieunten.gif); }
HTML-Code:
<div id="menu_p">
<div id="menustyle">
<div id="linkeecke">
</div>
<div id="rechteecke">
</div>
<div id="mitte">
</div>
</div>
<div class="menu">
<ul>
<li><a class="menutrenn" href="xxx">xxx</a></li>
<li><a class="menutrenn" href="team.html">Team</a>
<ul>
<li><a href="models.html">Models</a></li>
<li><a href="partner.html">Partner</a></li>
</ul>
</li>
<li><a class="menutrenn" href="service.html">Service</a>
<ul>
<li><a href="agb.html">AGB</a></li>
</ul>
</li>
<li><a class="menutrenn" href="equipment.html">Equipment</a></li>
<li><a class="menutrenn" href="referenzen.html">Referenzen</a></li>
<li><a class="menutrenn" href="kontakt.html">Kontakt</a></li>
</ul>
</div>