Thema: Son of Suckerfish Dropdown - IE7 verhält sich seltsam

Heyho!

Ich bin gerade extrem verwirrt. Ich wollte bei einem Joomla-Template eine horizontale Menüleiste in ein Dropdown verwandeln.

Der HTML- Code der mir ausgespruckt wird für das Menü sieht richtig aus.

PHP-Code:

<div id="horiz-menu">
         <div id="nav">
            <ul class="menu-nav">
               <li class="item53">
                  <a href="/index.php?option=com_content&amp;view=frontpage&amp;Itemid=53">
                    <span>Startseite</span>
                  </a>
               </li>
               <li class="parent item28">
                  <a href="/index.php?option=com_content&amp;view=article&amp;id=25&amp;Itemid=28">
                     <span>Branchen</span>
                  </a>
                  
                  <ul>
                     <li class="item57">
                        <a href="http://google.de">
                           <span>Nahrungs- und Genussmittel</span>
                        </a>
                     </li>
                     <li class="item59">
                        <a href="http://google.de">
                           <span>Produzenten</span>
                        </a>
                     </li>
                  </ul>
               </li>
               <li class="item29">
                  <a href="/index.php?option=com_content&amp;view=section&amp;layout=blog&amp;id=5&amp;Itemid=29">
                     <span>Produkte</span>
                  </a>
               </li>
               <li class="item18">
                  <a href="/index.php?option=com_content&amp;view=section&amp;layout=blog&amp;id=1&amp;Itemid=18">
                     <span>Kontakt</span>
                  </a>
               </li>
               <li class="item30">
                  <a href="/index.php?option=com_content&amp;view=article&amp;id=27&amp;Itemid=30">
                     <span>Impressum</span>
                  </a>
               </li>
            </ul>
         </div>
      </div> 


Soweit, so gut. Hier das CSS dazu.

PHP-Code:

#nav li:hover, #nav li.sfhover {
position:relative;
}

#nav {
    padding-left: 5px;
}

#nav ul {
    padding: 0;
    margin: 0;
}

#nav li {
    padding: 0;
    float: left;
    display: block;
    height: 30px;
    margin-right: 5px;
}

#nav a {
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    padding: 0px 16px 0 14px;
    text-decoration: none !important;
    cursor: pointer;
    font-weight: normal;
    font-size: 96%;
    font-weight: bold;
}

/* **************** Edit Suckerfish Edit ***************/ 

/* ausklappbares Untermenü */
#nav li ul { 
 position: absolute;
 width: 20em;
 left: -98%; /* Am Anfang sind sie natürlich "weg" */
}

/* Hovereffekt für Untermenüs */
#nav li:hover ul  { 
 left: auto;
 top: 30px; /* 30px ist auch das obere Menü hoch, also verschieben*/
}
/* **************** End Suckerfish Edit ***************/ 


Mein Problem jetzt:
-> IE6 : Geht garnicht (der kennt die Pseudoklasse :hover anscheinend icht, hab auch ne Lösung dafür gefunden. Da der aber bald eh ausläuft ist das fast nebensächlich.)
-> IE7 : Das aufgeklappte Menü ist zu weit links ( left: auto)
-> IE8 : Geht einwandfrei
-> FF3 : Geht einwandfrei
-> Opera : Geht einwandfrei

Was mach ich denn nur falsch beim IE7? Ist "left auto" falsch, oder wie muss ich die DIVs aufbauen, dass das geht?

Ich habe mittlerweile Kopfschmerzen und keine Lust mehr auf den Mist

Gr33tz
Tafkadasom2k5

Edit:
Hier kann mans ausprobieren!
Hier eine schlichte Version (nicht von mir), da hab ich mir das abgeguckt. Das funzt komischerweise überall...

Okay, ich habe nun eine IE7- Weiche eingebaut. Die IE6 Weiche folgt noch.

Problem ist, dass ich den ul li a-Elementen eine Box zugewiesen habe- und die Untermenüpunkte sollten sich eigentlich beim Hover des Parent- Listeneintrags per "Left: auto" an die richtige Stelle verschieben. Das Klappmenü "erscheint".

Left- Auto funktioniert aber bei dem Boxen- Modell anscheinend nicht im IE7, welches ich den a-Elementen zugewiesen habe. (Also die hier horizontale Liste ist an sich sehr schlicht, aber alle a-Elemtne haben eine Box) An sich war diese Lösung echt schön: Die Listen haben sich relativ gut an die Einträge angepasst, da die Boxen sich auf das a- Element bezogen.

Ich habe jetzt allen Boxen feste Werte zugewiesen, und habe die komische Verschiebung der Untermenüpunkte einfach in der IE7- Weiche manuell ausgeglichen. (Margin-left Das ist keine schöne Lösung, und sie lässt dieses Menü in echt schlechtem Licht erscheinen, aber soweit gehts... erstmal. Verdammte IE <= 7 reihe...

Jetzt kommt der horrende Teil... IE6. Hab jetzt schon Augenränder wenn ich daran denke.

Gr33tz
Tafkadasom2k5