diese seite sieht im internet explorer so aus wie ich sie haben möchte. beim test mit dem firefox ist mir aber aufgefallen, dass einiges verschoben ist und oben der weiße rand fehlt. leider finde ich den fehler nicht.
wäre dankbar wenn mir hier einer auf die sprünge helfen kann.

Kann natürlich an den verschachtelten divs liegen. Hab jetzt selber nicht genau nachvollziehen können welches öffnende div zu welchem schließenden div gehört. Du solltest bei der semantischen Auszeichnung nicht für jedes Element div benutzen sondern Links z.B. mit ungeordneten Listen machen, also <ul><li></li><li></li></ul> und diese dann mit css vertikal oder horizontal anordnen.

Schau Dir z.B. mal auf dieser Seite die Sachen unter Listamatic an. Da gibts auch nen extra Punkt "horizontal lists", mit verschiedenen Beispielen.

zu deinem problem..

also der verschiebung, entsteht durch das "padding:2px bei jedem nav-div..
einen rand machst du nunmal am besten mit border ... -bei dir, solltest du für #main noch ein padding:10px hinzufügen..

du solltest dir aber dringend (!) überlegen, ob du so wie du das amchst, es sinnvoll ist.. wie eve schon gesagt hat, das menu am "besten" mit listen.. das geht auch in jedem browser relativ gut.. auch ist ein div meinesachtens nicht für sowas wie bei dir gedacht.. auch finde ich es nicht sinnvoll, für jeden div eine id zu geben, etc.. denn das ist meinesachtens auch nciht der sinn von css, alles mal durchnummerieren etc..

was ich dann auch nciht verstehe, warum du, wenn du schon divs benutzt, und keine tabellen, du trotzdem nicht w3c valides html / xhtml schreibst..

mfg
nisita

---
"Wir sollten lernen, uns allmählich vom Überfluss zu befreien, um zur Einfachheit unseres eigenen Wesens vorzudringen." Jean Gastaldi

Der Fehler liegt tatsächlich in der Angabe
.
(Einheiten gab es auch mal...)

Für den IE ist padding innerhalb von width & height, bei Mozilla außerhalb. Daher sind die Boxen im Mozilla 4px höher und breiter (miss nach...). Dank relativer Positionierung kommt der Treppeneffekt zustande. Lösung wie beschrieben. Allerdings musst du dann auf feste Breiten und Höhen verzichten, die Mozilla bei Inline-Elementen nicht unterstützt.

du meinst, die bei inlinelementen sowieso grundsaetzlich falsch sind.

---
get OPERA for free