php-resource




Archiv verlassen und diese Seite im Standarddesign anzeigen :
Float IE und FF


 
prego
03-05-2006, 01:37 
 
Hi,

ich verstehe hier was mit dem Float nicht ganz. Ich möchte beispielsweise 3 gleich große Div's nebeneinander Anordnen.

Besipiel:

<div style="border: 1px solid grey;">
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
</div>



Nun ergibt sich aber ein Problem. Der Rahmen ist im FF nur etwa eine Zeile hoch und die inneren Boxen "floaten" hinaus. Duch eine Float-Angabe auf dem äußeren Div lässt sich das ganze lösen, so das die inneren Boxen IM äußeren Div sind.
Der IE (6+7) benötigt das äußere float nicht. Irgendwie sehe ich es auch nicht ein, das äußere Div zu floaten, brauch es ja ansich auch nicht.

Wo ist mein Denkfehler?


Dank euch schonmal ;)

 
Kropff
03-05-2006, 10:58 
 
welche doctype? bei xhtml transitional siehts im ie genau so aus wie ff, was ja eigentlich auch richtig ist, da du die elemente aus dem fluss nimmst.

tipp: letztes float raus und mit margin-left arbeiten

gruß
peter

 
Wurzel
03-05-2006, 11:21 
 
tipp 2:.clear {
clear:both;
overflow:hidden;
height:0;
display:block;
}
html>body .clear {
overflow:visible;
} ins stylesheet, und das konstrukt so aufbauen:<div style="border: 1px solid grey;">
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
<div style="width: 200px; height: 100px; float: left; border: 1px solid red;"></div>
<div class="clear">&amp;nbsp;</div>
</div>

 
prego
03-05-2006, 11:25 
 
Hmm, doctype ist xhtml 1.0 transitional.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Das mit dem clear: both erscheint mir aber wenigstens logisch. Danke euch beiden. Werd mir dann wohl doch nochmal das float Kapitel im dicken CSS Buch durchlesen müssen...


Alle Zeitangaben in WEZ +2. Es ist jetzt 20:00 Uhr.