D.R.: Dynamische Breite von floatenden Blockelementen?

Beitrag lesen

Hi,

Hallo, ich möchte folgendes Layout ohne Tabellen umsetzen:

http://www.janus-wa.de/layouts/cah-med/angebote.gif

Dabei möchte ich, dass sich die 3 Spalten je nach vorhandenem Platz in der Breite verändern. Sprich wird der Platz breiter, so verteilt sich der vorhandene Platz gleichmäßig auf alle 3 Spalten (liquid).

Nimm jeweils ca. 30% für jede Spalte und gib ihnen float:left. Zusätzlich brauchst du noch ein clearendes Element, das du als letzes Einfügst z.B. <div style="clear:left"></div>.

Ich dachte zunächst daran jede Spalte in ein "<li>" zu setzen wobei jede Spalte die Eigenschaft float:left; bekommt, damit sie nebeneinanderstehen (oder mit display: inline;). Das Problem ist jedoch dann, dass sich die <li>s nur noch an ihren Inhalt anpassen.

Nein, ich würde die Blockeigenschaften schon beibehalten.

Ich möchte außerdem beachten, dass das ganze auch noch funktioniert, wenn eine oder 2 Spalten wegfallen (ergo: 50% : 50% bzw. 100% Verteilung).

Dann müsstest du mehrere Klassen (für's übergeordnete Element) definieren.

Mit einer Tabelle wäre das am einfachsten lösbar, aber darauf möchte ich verzichten, ist es mit CSS möglich, dass sich die Breite nebeneinanderfloatender Blockelemente je nach vorhandenem Platz verändert?

Nein, nicht wirklich. Du solltest aber auch beachten: Tabellen sind nicht immer falsch. Sofern es sich um tabellarische Daten handelt, sind sie durchaus angebracht. Und ich würde es schon bald als tabellarische Daten einschätzen.

Einen schönen Donnerstag noch!

--
Mein Lieblings-Browser:
Firefox 1.5
Mein Lieblings-Notepad:
Notepad 2