✔ Problem mit Eigenbau CSS Dropdownmenü

[Promaetheus]

Ich habe gerade versucht ein eigenes Dropdownmenü mittels CSS zu realisieren. Leider funktioniert dies nicht so ganz ohne Probleme.
Ich habe es so erstellt wie es für mich logisch war und ich nach einiger Recherche als korrekt empfinde/empfand.

Im IE8 funktioniert es am besten. JA... das war auch für MICH ein Wunder festzustellen. ;o)
Im Firefox habe ich ein Problem dass unter der Navigationsreitern ca. 1 Pixel breit ein "blinder Fleck" ist und dort die child-Elemente wieder zuklappen. Im IE8 passt das.
Im IE6 jedoch werden die childs überhaupt rechts unter dem Hauptmenüpunktreiter dargestellt.

Ich würde Euch bitten mal kurz draufzuschauen ob ich irgendwelche groben Fehler gemacht habe. Bitte nicht auslachen, denn es wird sicher nicht SO sauber gecodet sein wie es ein Fortgeschrittener macht.

Ich wäre Euch für Tipps und Anregungen was ich falsch gemacht haben könnte sehr dankbar.
Die URL zur Seite wäre http://www.kfz-servicecenter.at

Hier wäre der Auszug aus der style.css:

/* menue */
#nav {position: absolute; bottom: 3px; left: 1px; display: block; float: left; padding: 0; margin: 0 0 0 25px; list-style: none;}
#nav ul {list-style:none;}
#nav li {float: left; border-bottom: 1px solid #414e53; margin: 0 5px 0 0; padding: 0;}
#nav li:hover {border-bottom: 1px solid #486065;}
#nav a {float: left; display: block; padding: 5px 5px 3px 5px; background: #526a74; color: #fff; font-weight: bold; border-bottom: 2px solid #4a5e65;}
#nav a:hover {background: #5c7d86; border-bottom: 2px solid #527077; color: #fff;}

/* dropdown menue for child pages */
#nav li ul {position: absolute;	z-index: 10; width: 150px; margin: 0 0 0 0px; top: 27px; visibility: hidden;}
#nav li li a, #nav li li a:visited {width: 150px;}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {visibility: visible;}

 

[Maik]

Hi,

da hast du dich im Forum verlaufen, denn mit Javascript hat dies wohl nichts zu tun

Änder mal für das Untermenü die Positionsangabe top:27px in top:24px um, und richte die verlorenen 3px als oberen Innenabstand ein.

mfg Maik

 

[Promaetheus]

Opppps. Sorry. Ich wollte das ins CSS-Forum posten. Sorry vielmals. Danke für den Tipp. Ich werde das gleich ausprobieren.

 

[Maik]

Jo, kein großes Ding - dafür bin ich als Mod doch da, um die Fragen dem Fachpublikum zuzuschanzen

 

[Maik]

Sorry, hab eben glatt den IE6 vergessen :-(

Damit er das Submenü korrekt ausrichtet, sind diese zusätzlichen Angaben vonnöten:

1. z-index-Deklaration für #header, damit das Submenü nicht hinter dem Inhalt erscheint.
2. position:relative für die <li>-Elemente der oberen Menüebene.
3. Positionsangabe left:0 für das Untermenü.

mfg Maik

 

[Promaetheus]

Danke Maik!

Eine Antwort, bzw. Hilfestellung ist für mich nicht selbstverständlich und ich bin sehr dankbar dafür. Im Übrigen möchte ich dir nochmals herzlich danken für die tolle Arbeit die du hier leistest. Wie ich schonmal erwähnte sollte dir ein Preis verliehen werden.

Danke auch für deine kompetente Hilfestellung zum IE6. Auf DAS wäre ich nie gekommen. Es funktioniert nun wunderbar. Vergelts Gott aus Tirol und noch einen schönen Abend Maik! DANKE!

 

[Maik]

Danke, danke, ich mach hier doch "nur" meinen Job, verirrte Themen zu ihrem angestammten Platz zu geleiten, und den Usern mit hilfreichen Tipps zur Seite zu stehen :-(

Bei soo viel "Danksagungen" darfst du ruhig den "Danke"-Button unterhalb meiner Beiträge nutzen, oder mir auch eine positive Bewertung zukommen lassen.

Danke!

mfg Maik