Dynamische CSS-Container: Div unten halten

[Wrangelmors]

Hallo,

ich möchte das im Anhang hochgeladene Design verwirklichen. Mein Problem ist, dass ich in einer Spalte, die eine dynamische Höhe hat, das orange DIV unten platzieren möchte (siehe linke Spalte). Wie erreiche ich das?

Die rechte Spalte wäre übrigens mein Gedanke zur Lösung mittels eine TABLE gewesen. GRÜN stelle ich als TABLE mit height="100%" dar und definiere einfach in der unteren Zeile des TABLE den Inhalt (nämlich das orange DIV) unten auszurichten. Leider funktioniert das nicht, da der TABLE erst gar nicht height="100%" berücksichtigt, sondern beide Höhen beider Zeilen mit der Höhe ihrer Inhalte gleichsetzt. Scheinbar scheint er die Höhe des übergeordneten DIV nicht zu kennen.

Vielen Dank für Hilfe.

[sejuma]

Ich würde es so lösen:

Arbeite in der rechten Spalte mit drei Divs und gib diesen eine bestimmte Höhe. Dem mittleren, der dynamisch sein soll, weise ein "overflow: auto;" zu, siehe http://www.ohne-css.gehts-gar.net/0064.php

[Wrangelmors]

Richten sich allein dadurch die drei DIVS insgesamt an 100% der ihnen zur Verfügung stehenden Höhe aus?

Angenommen Kostellation: Oberes DIV mit Höhe = 100px, unteres DIV mit Höhe = 100, dann wird das mittlere DIV doch nicht automatisch 400px hoch, wenn 600px Höhe zur Verfügung stehen würde, oder?

[sejuma]

Nein:
Entweder man weist den divs eine fixe Höhe zu (z.B. 500px).
Oder einen relativen Wert (z.B. 50%)
Wenn html und body mit 100% Höhe definiert sind, dann kann man 3 Divs rozentuale Höhen zuweisen, z.B. 30%, 50%, 20%

Doch Vorsicht: Nach dem CSS-Boxmodell muss man da noch padding, boeder und margin-Werte hinzurechnen. Werden solche Werte verwendet, dann steigt die Gesamthöhe auf über 100%.
Das Problem ist, dass man Prozent und Pixel nocht auf einen nenner bringt.
Die Prozentwerte sind immer von der Größe des Browserfensters abhängig.

Wenn man in der Breite zwei fixe divs (Pixelbreite) hat, dann kann ein dritter div die Restbreite einnehmen.

[Wrangelmors]

Das ist leider das Problem: Da die Höhe des Gesamt-DIVs dynamisch, nämlich durch den Inhalt, bestimmt wird, kann ich keine fixe Höhe angeben.