IE6 Geisterabstand zwischen 2 gefloateten Containern

  • Hallo liebe TP-CSS-Profis,


    ich habe ein PRoblem wie im Titel schon beschrieben hiermit:
    IE6 Geisterabstand zwischen 2 gefloateten Containern


    Das Online-Beispiel gibt es hier: IE6 Geisterabstand zwischen 2 gefloateten Containern


    Das HTML/CSS stammt aus einer Dreamweaver-Vorlage welche ich nur geringfügig im CSS abgeändert habe.


    Original-CSS:

    HTML
    1. .twoColFixLtHdr #sidebar1 {
    2. float: left; /* Da es sich hier um ein floatendes Element handelt, muss eine Breite angegeben werden. */
    3. width: 200px; /* Die tatsächliche Breite dieses div umfasst in standardgerechten Browsern bzw. im Standardmodus von Internet Explorer außer der Breite auch die Auffüllung und den Rahmen. */
    4. background: #EBEBEB; /* Die Hintergrundfarbe wird nur für die Länge des Spalteninhalts angezeigt. */
    5. padding: 15px 10px 15px 20px;
    6. }
    7. .twoColFixLtHdr #mainContent {
    8. margin: 0 0 0 250px; /* Durch den linken Rand dieses div-Elements entsteht die Spalte am linken Seitenrand. Der Spaltenbereich bleibt unabhängig von der Inhaltsmenge des sidebar1-div immer gleich. Sie können diesen Rand entfernen, falls der Text des #mainContent-div den Bereich von #sidebar1 füllen soll, wenn der Inhalt in #sidebar1 endet. */
    9. padding: 0 20px; /* padding (Auffüllung) bezeichnet den Innenabstand und margin (Rand) den Außenabstand der div -Box. */
    10. }


    Modifiziertes-CSS:


    Es geht um den Sidebar und den Content-Container, diese sollten sich nahtlos aneinander schmiegen auch im IE 8)


    Ich habe dafür bis jetzt keine Lösung gefunden *haareausrauf*

  • Im IE6 hab ich keinen Abstand zwischen den Boxen - Link. Hab das mal selbst nachgebaut ;).


    Danke Rinaldo für den Nachbau, das bringt mich aber nicht wirklich weiter...


    Auf der Adobe Summer School 2007 wurde demonstriert wie mit den in Dreamweaver mitgelieferten CSS-Layouts schnell neue Seiten erstellen kann.


    Dieses Feature möchte ich nutzen und erweitern.
    Dazu müsste ich wissen wo in dem Adobe-CSS der Fehler liegt...

  • Das ganze kommt vom Fehlerhaften Boxmodel des IE; FF rechnet korrekterweise den 1px Rahmen zur Breite dazu, IE 6 nicht. Somit ist die linke Box nur 230px breit, die rechte hat aber ein Margin von 232px. Hier müsste ne Browserweiche ran!


    //Edit: kommando zurück...muss nochmal nachschauen :D

    Anstatt zu klagen was ihr wollt, solltet ihr dankbar sein, dass ihr nicht all das bekommt, was ihr verdient ;)
    ------------------------------------------
    Virtuelle Babyparty :D
    ------------------------------------------
    [COLOR="SeaGreen"]ich will mehr grüne kästchen!


  • Vielen Dank Boris, bin gerade beim durchstöbern von Ninas IE Buglist darauf gestoßen, das es dieser 3px Bug sein könnte.


    Nur kapiere ich nicht ganz was ich in meinem Beispiel aus diesem Muster machen müsste:


    Vielleicht hätte jemand mit mehr CSS und Englisch-Erfahrung (als ich sie habe) einen passenden Tipp für mich ;)