ausrichtung von <div> mittels css

http://www.thenoodleincident.com/tu...sson/boxes.html

oder direkt hier: http://www.thenoodleincident.com/tu...sic2_fluid.html

verstehen tu ich das nicht ganz, aber funktionieren tuts

Bingo

Das ganze dann nicht als inline-styles sondern in eine eigene CSS deklaration und es schaut auch nicht mehr so fuerchterlich viel code aus.

Bsp

Code:

<style type="text/css">
  .ie5-center-hack {
    text-align: center;
  }
  #content {
    width: 600px;
    text-align: left;
    margin: 0 auto 0 auto;
    background-color: tan;
  }
  #leftSide {
    width: 300px;
    float: left;
  }
  #rightSide {
    width: 300px;
    float: left;
  }
   #content br {
      clear: left;
   }

HTML

Code:

<div class="ie5-center-hack">
  <div id="content">
    <div id="leftside">
    </div>
    <dif id="rightSide">
    </div>
    <br>
  </div>
</div>

"floats" werden aus dem "flow" eines Dokumentes genommen.

Teste einfach folgendes: gibt das clear: left beim br-Tag weg, dann wirst du sehen das die Hintergrundfarbe von Content (background-color: tan) nicht hinter leftSide und rightSide zu sehen sein wird.

Da sie aus dem "flow" genommen werden, verbrauchen Sie auch keinen Platz im Dokument; d.h. das #content-Div ist quasi leer (auch wenn die left/rightSide DIVs eigentlich drinnen sind) bzw. wird leer dargestellt.

Wenn aber ein Element mit dem gesetzt clear-Property folgt, erzwingt es den folgenden Bereich unter die floats zusetzen; und somit gibts auch kein Problem mehr in diesem Beispiel mit der Hintergrundfarbe.

right/left bei float gibt an, auf welcher Seite ein Reihen unter den floats erzwingen werden soll. Floats koennen ja links oder rechts ausgerichtet sein, darum die zwei angaben. Oder beide mit "both".

HTH