Fehler im IE: FLOAT + MARGIN in Kombination?

[Jens Veerbeck]

Hallo lieber HTMLer,

ich habe folgenden "lustigen" Effekt im IE 6 entdeckt, der mich zwei Stunden Testen gekostet hat:

Ich möchte ganz simpel 2 DIVs nebeneinander darstellen. In etwa so:

<div style="width:600px; height:300px; border:solid 1px;">

<div style="width:200px; height:200px; float:left; border:solid 1px; margin-left:20px;"> </div>
<div style="width:200px; height:200px; float:left; border:solid 1px; margin-left:20px;"> </div>

</div>

Im IE 6 wird nun der margin-left-Wert des linken DIVs verdoppelt! Das liegt an der Kombi aus margin-left und float. Mit padding-left oder den anderen margin-Richtungen ist alles normal.

Das äußere DIV dient nur der Veranschaulichung, dass der Effekt nicht durch ein Body-Attribut ausgelöst wird...

Kann mir jemand sagen, ob ich entweder einen Knick im Hirn habe, oder ob es eine Lösung für das Problem gibt?

Vielen Dank,
Gruß
Jens Veerbeck