Scooter: Wie mächtig ist floatendes CSS-Layout?

Beitrag lesen

Hi,

habe mich nun etwas mit CSS-Layout beschäftigt und auch den tollen Artikel dazu von Ingo bei SelfHTML (teilweise) gelesen.
Ich finde es ist schon ne tolle Sache seine Seiten mit CSS zu layouten, frage mich aber trotzdem wie mächtig das Ganze ist.

Ich finde nämlich keine Lösung für z.B. folgendes Problem:

-------------------------------
|    Box 1 mit Inhalt         |
-------------------------------
-------------------------------
| Box 2 mit anderem Inhalt     |
--------------------------------

Nun möchte ich die Seite anders layouten und die beiden Boxen vertikal (!!) vertauschen. Also so:

-------------------------------
| Box 2 mit anderem Inhalt     |
--------------------------------
-------------------------------
|    Box 1 mit Inhalt         |
-------------------------------

Mit absoluter Positionierung natürlich gar kein Problem, aber floatendes Layout ist wohl besser. Wie geht es also mit floats?

Der Code sieht dann etwa so aus:
<div id="box1">Inhalt1</div>
<div id="box2">Inhalt2</div>

Ähnliche Probleme gab es bei 3 nebeneinander stehenden Boxen ("Spalten"), die mit floats ausgerichtet wurden. Man konnte das Layout zwar mit float:left und right in 2 der 3 Boxen ansatzweise ändern, aber jede denkbare Anordnung (6 insgesamt) der Spalten hab ich nicht hinbekommen. In dem CSS-Layout Artikel steht, dass das letzte definierte Element kein float enthalten darf, sondern die beiden davor definierten Elemente (Spalten) um die dritte Spalte herum fließen.
Man kann also z.B. beide links oder rechts herum fließen lassen:

1 | 2 | 3
3 | 1 | 2

Aber ein Umordung der beiden Spalten mit floats konnte ich nicht erreichen. Da wurde dann die Reihenfolge genommen, wie es im HTML-Doc steht.

Wieviel kann man also machen mit diesem floating CSS-Layout?

Gruß
Scooter!