Harlequin: float:left und der IE

Beitrag lesen

SELF-Forum

float:left und der IE

Harlequin
– Informationen zu den Bewertungsregeln

Hi,

ich versuche gerade von meinen Tabellenlayouts loszukommen, aber irgendwie spielt der IE nicht mit.

Ich habe folgende Konstruktion:

<div class="DisplayArea">
<div class="DisplayCellFloat" style="Width:100%">
<div class="innerDIV">
<div class="BoxTableDesign BoxCellDesign HeadLine">
...Text und Bild...
</div>
<div class="BoxTableDesign BoxCellDesign" style="padding:15px;overflow:auto;">
...verschiedene Divs mit float left und right nebeneinander...
</div>
</div>
</div>

...und das gleiche nochmal aber der 2. innerste Div nur mit &nbsp; als Inhalt

</div> <!--- hier endet der erste DisplayArea Div-->

CSS:
.DisplayArea{
 width:65.3em;
}
.DisplayCellFloat{
 border:none 0px;
 vertical-align:top;
 padding:0px;
 margin:0px;
 float:left;
}
.innerDIV{
 padding-right:1.167em;
 padding-bottom:1.167em;
 padding-left:0px;
 padding-top:0px;
}
.BoxTableDesign {
 border-style:none;
 background-color:#E9EEF5;
}
.BoxCellDesign {
 border:solid 1px #808080;
 border-top:none;
 padding:0px;
 vertical-align:top;
 text-align:center;
}
.HeadLine{
 color:#d40000;
    font-weight:bold;
 border-top:solid 1px #808080;
 padding-left:10px;
 padding-right:10px;
}

Im Firefox sieht alles top aus, aber beim IE wird die zweite Box falsch dargestellt. Unter dem eigentlichen Abschlussrahmen wird die Box fortgesetzt und nochmals mit umrahmt. Als Abhilfe habe ich gefunden, dass ein <span style="clear:both;"></span> zwischen den Boxen hilft, allerdings beendet der mir den Float der einzelnen Boxen, was mir in manchen Fälle im Weg stehen wird, da die Klassen allgemien für mehrere Seiten gelten sollen. Die Versuche den clear:both weiter innen zu benutzen sind fehlgeschlagen, habe auch an allen möglichen Ecken mit overflow:auto/height:1% experimentiert aber ohne Erfolg. Kennt jemand das Problem? Oder muss ich wieder zu Tabellen zurückkehren?

Gruß,

harlequin

PS: ich hoffe ich habe alle relevanten Ausschnitte hier gepostet und bitte nicht über die etwas redundanten CSS-Klassen wundern, die kommen durch den Umbau und sollen noch bereinigt werden, wenn es denn mal ohne Tabellen geht.

Beitrag melden
–
Informationen zu den Bewertungsregeln