Ingo Turski: Wie mächtig ist floatendes CSS-Layout?

Beitrag lesen

Hi,

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?

gar nicht. Allerdings ist das mit absoluter Positionierung durchaus nicht problemlos. Du übersiehst, daß in den Boxen enthaltener Text vergrößert werden kann oder die Boxen nicht in zu kleinen Browserfenstern passen könnten.
Ich sehe aber auch nicht viel Sinn in einer zur Notierung umgekehrten Darstellung. Geringfügige Vorteile bei Suchmaschinen vielleicht. Für Screenreader wäre ein (unsichtbarer) Link zur nächsten Box möglich.

In dem CSS-Layout Artikel steht, dass das letzte definierte Element kein float enthalten darf

Nein. Es kann - beim zuletzt notierten Element - auf float verzichtet werden, muß aber nicht.
Der Vorteil dabei (und der Grund, weshalb es so in den Beispiel-Layouts ist) ist die erhöhte Flexibilität bzw. Ausgleich unterschiedlicher Box-Modele durch Verzicht auch auf eine Breitenangabe.

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.

Wenn Du allen Boxen float (und Breite) gibst, wäre zumindest 1-3-2, 2-3-1 und 3-2-1 möglich.
Für andere Anordnungen würde es reichen, ein Element absolut zu positionieren, z.B.
3 position:absolute und 1 und 2 float:left.

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

Viel und das vor allem flexibel. Aber nicht alles.

freundliche Grüße
Ingo