menü mit divs und css schaut auf verschiedenen browsern anders aus [Hilfe!]

  • Hi!
    Gleich im voraus, ich bin neu. Sollte das also an der falschen stelle sein bitte ich einen mod es zu verschieben.


    Ich versuche gerade wieder mit html und css zu beginnen (hab es das letzte mal vor 2 Jahren verwendet) und erstelle gerade eine Seite mit einem auf css basierendem Menü.


    Mein momentaner code:


    Ich habe mit windows zu arbeiten begonnen und jetzt das ganze Projekt auf meinen Laptop kopiert (osx10.8 ) um im Urlaub weiterarbeiten zu können.
    Jedoch haben auf meinem mac alle css formatierungen nicht mehr richtig funktioniert:


    So sieht es jetzt auf meinem mac aus:


    So in parallels(virtuelles windows):


    und so auf windows(Ziel):


    Bin mit meinem Latein am Ende, es sollten eigentlich alle browser unterstützt sein...
    Danke im voraus, Jacky


    EDIT:Und es ist wichtig das die Größen mit Prozent und nicht mit px geregelt sind.
    EDIT2: CSS wird später in eine externe Datei verschoben.

  • Dir fehlt der Doctype.
    Warum verwendest du z-index?
    Warum verwendest du Position: absolute?
    Warum verwendest du erst min-height und danach height: auto? Was davon willst du denn?
    Verzichte auf !important, das ist nicht notwendig, oder du machst etwas falsch.
    Warum zentrierst du dein Hintergrund?
    Warum ist dein Listenmenü nicht eine Liste bestehend aus UL und LI Elementen?


    Ein div inhalt zu nennen ist aussagelos, welcher Inhalt wird repräsentiert?
    Das DIV hintergrund kannst du dir sparen, dein Hintergrund ist body, wende die Farbe darauf an.

  • dieses konstrukt hier:

    Code
    1. min-height:100%;
    2. height:auto !important;
    3. height:100%;


    kenne ich nur als min-height-fix für den guten alten IE6.
    aber, dann gehört der teil hier:

    Code
    1. height:auto !important;
    2. height:100%;


    in die ie6fix.css ausgelagert und nicht direkt ins normale stylesheet rein