IE7: Aufklappmenü zeigt Kategorie nicht an

boykottke

Mitglied
Hallo,

So kurz vor Weihnachten noch mal ne Problemschilderung, bei der ich einfach nicht weiterkomme. Problem ist folgendes:

Für den Safeclub Kamenz habe ich eine Seite gebastelt, deren Menü *normalerweise* aus fünf kategorien besteht, und per css ein hovermenü aufrufen kann. Nun, soweit die graue Theorie. In der Praxis funktioniert das jedoch nur im Firefox, IE7 hält gar nichts von der Idee und lässt einfach einen Programmpunkt "history" komplett aus der Darstellung raus. Im Quelltext taucht er auf, nicht jedoch in der Darstellung mit aktiviertem CSS. Ich gehe also einfach mal davon aus, dass es am CSS liegt.

Hier der Quelltext:

html:

HTML:
<div id="safeclub">
 <div id="header">
                  <div id="navi">
                          <ul>
                                  <li><a href="index.php?kategorie=3&ucat_id=1&ucat_style=1"><img src="img/safe_home_red.gif" width="130" height="28" border="0" alt=""></a></li>
                                         <li><a href="index.php?kategorie=4&ucat_id=2&ucat_style=2"><img src="img/safe_termine_grey.gif" width="130" height="28" border="0" alt=""></a></li>
                                  <li><img src="img/safe_verein_grey.gif" width="130" height="28" border="0" alt="">
                                         <ul><li><a href="index.php?language=0&kategorie=5&ucat_id=3&ucat_style=1">vorstand</a></li><li><a href="index.php?language=0&kategorie=5&ucat_id=14&ucat_style=1">formalia</a></li><li><a href="index.php?language=0&kategorie=5&ucat_id=15&ucat_style=1">unterstützer</a></li><li><a href="index.php?language=0&kategorie=5&ucat_id=16&ucat_style=1">links</a></li></ul>
                                         </li>
                                         <li><img src="img/safe_history_grey.gif" width="130" height="28" border="0" alt="">
                                         <ul><li><a href="index.php?language=0&kategorie=6&ucat_id=4&ucat_style=1">geschichte</a></li><li><a href="index.php?language=0&kategorie=6&ucat_id=10&ucat_style=6">fotos</a></li><li><a href="index.php?language=0&kategorie=6&ucat_id=11&ucat_style=1">ahnen</a></li></ul>
                                         </li>
                                         <li<img src="img/safe_kontakt_grey.gif" width="130" height="28" border="0" alt="">
                                         <ul><li><a href="index.php?language=0&kategorie=7&ucat_id=5&ucat_style=1">kontakt</a></li><li><a href="index.php?language=0&kategorie=7&ucat_id=12&ucat_style=1">anfahrt</a></li><li><a href="index.php?language=0&kategorie=7&ucat_id=13&ucat_style=7">gästebuch</a></li><li><a href="index.php?language=0&kategorie=7&ucat_id=17&ucat_style=1">impressum</a></li></ul>
                                         </li>
                                 </ul>
                         </div>
 
 </div>
...
</div>


Und in CSS:

Code:
#safeclub {
         position:   absolute;
         width:   772px;
         left:   50%;
         margin-left:  -386px;
         margin-top:  10px;
}
#header {
 height:   128px;
         width:   772px;
         border-bottom:  solid 2px;
         border-color:  #000000;
         background-image: url('../img/safe_header.gif');
         background-repeat: no-repeat;
}
* html #header {            /*  Gilt nur für IE  */
 height:    130px;
 
}
/* NAVIGATION */
#navi {
         position:   relative;
         top:   100px;
         left:   -40px;
         width:   772px;
 z-index:   100;
         margin:   0px;
}
* html #navi {            /*  Gilt nur für IE  */
 width:    772px;
         left:   0px;
}
#navi ul {
 list-style-type: none;
 display: inline;
 margin: 0px;
 float: left;
}
#navi li{
 position: relative;
 float: left;
}
#navi li ul {
 display: none;
 margin: 0;
 padding: 0;
 left: 0px;
 width: 130px;
 border: 0;
}
#navi li ul li {
 margin: 0;
 padding-top: 3px;
 padding-bottom: 3px;
 width: 130px;
 text-align: center;
 border-right: solid 1px;
 border-left: solid 1px;
 border-bottom: solid 1px;
 border-color: #dddddd;
 background-color: #ffffff;
}
#navi li ul li a {
 font-weight: normal;
 font-size: 11px;
}
#navi li ul li:hover {
 background-color: #f3f3f3;
}
#navi li ul li:hover a {
 text-decoration: none;
}
#navi li:hover ul, #navi li.iehover ul {
 display: block;
 margin: 0;
 padding: 0;
 position: absolute;
 z-index: 100;
 top: 28px;
 width:130px;
 left: 0px;
}


Hat irgendjemand eine Idee, woran es liegen könnte? Ich bin ein wenig mit meinem Latein am Ende.

LG und Danke im Voraus,

Thomas
 

Neue Beiträge

Zurück