IE6 zerschießt Logo-Bereich (CSS)

  • Ich hab mir mal die Sektion der typischen IE-Bugs angeschaut, aber ich weiss nicht so recht, was hier zutrifft. Ich schildere das Problem:


    In Safari wird alles korrekt dargestellt, im IE6 entsteht eine unerklärliche Lücke zwischen Logo-Bereich und Navigation (s. Fragezeichen). Ich kopiere die entsprechenden Stellen des Codes hier rein:


    Code
    1. <body>
    2. <div id="container">
    3. <div id="pic_area"><img src="path/to/pic.jpg" /></div>
    4. <div id="logo_area"><a href="/"><img src="path/to/logo.jpg" /></a></div>
    5. <div class="clearboth"></div>
    6. <div id="primary_nav_bar">...NavLinks...</div>
    7. ...
    8. </body>



    Ich wette, das hat irgendwas mit margin/padding/border oder so zu tun. Aber ich finde den Fehler nicht. Über jeden Tipp wäre ich sehr dankbar!

  • Rufe deine Seite im Browser auf und gib in die Adresszeile


    javascript:alert(document.compatMode);


    ein. Wenn sowas wie CSS1Compat zurück gegeben wird, dann arbeitet der IE im Standardmodus.

    Je größer der Deppenfaktor, desto gigantischer das Bescheidwissergefühl
    -Dieter Nuhr
    :D

  • Sind da vielleicht irgendwelche Margins oder Paddings, die dem IE nicht passen könnten?


    Die verlinkten Hintergrundbilder hatte übrigens ursprünglich eine Größe von 700x240 bzw 300x240. Die divs aber nur Breiten von 699 und 299, da jeweils an einer Seite noch eine 1x border dran war.


    Für alle Browser war das ok, nur der IE6 hat das rechte Bild in eine neue Zeile gerückt. Den Fehler hab ich schon mal weg bekommen, indem ich die Bilder an sich auch auf 699x239 gestutzt habe.


    Aber diesen Fehler hier finde ich einfach nicht.

  • Es kommt auf den IE an (da musst du das Testen), weil der nämlich aus verschiedenen Gründen immer wieder in den Quirksmode geht, während die anderen Browser im Standardkonformen Modus rendern.

    Je größer der Deppenfaktor, desto gigantischer das Bescheidwissergefühl
    -Dieter Nuhr
    :D