[CSS:] »Mitwachsende« div-Bereiche?

Computer: Software & Programmierung HTML & CSS
#1

Hallo,

folgender Code:

[css]

#container {
 position: absolute;
 left: 37px; 
 top: 0px;
 width: 740px;
 border-width: 4px;
 border-style: solid;
 border-color: #E55300;
}
#balken {
 position: absolute;
 left: 0px; 
 top: 0px;
 width: 100%;
 height: 24px;
}
#content {
 position: absolute;
 left: 0px; 
 top: 24px;
 width: 100%;
}

[html]

Wie schaffe ich es, dass der container dynamisch mit dem Textinhalten
des content-Bereichs mitwächst und die Umrandungslinie auch wirklich
alles umrandet?
Irgendwie scheint die Ausdehnung eines div-Bereichs nur dann
automatisch mit dem Inhalt mitzuwachsen, so lange die Elemente darin
nicht noch mit einem weiteren div-Bereich umschlossen sind.

Grüße
Tobias

#2

Wie schaffe ich es, dass der container dynamisch mit dem
Textinhalten
des content-Bereichs mitwächst und die Umrandungslinie auch
wirklich
alles umrandet?

Du darfst wenn du sowas produzieren willst die inneren Elemente nicht absolut positionieren, da diese sonst aus der Berechnung der Elternelemente herausfallen.

#3

Du darfst wenn du sowas produzieren willst die inneren
Elemente nicht absolut positionieren, da diese sonst aus der
Berechnung der Elternelemente herausfallen.

Danke für die Info! Fallen die Elemente auch aus der Berechnung,
sobald ein float definiert ist?
(Und: Wo kann ich denn solche Spezifika nachlesen?)

Gruß
Tobias

#4

(Und: Wo kann ich denn solche Spezifika nachlesen?)

Spezifikation von CSS 2.1 (der aktuellste anerkannte Standard):
http://www.w3.org/TR/CSS21/

Bestimmung des enthaltenden Elements abhängig von der Positionierungsart:
http://www.w3.org/TR/CSS21/visudet.html#containing-b…

Irgendwie habe ich jetzt doch den Eindruck, dass in deinem Fall #container als enthaltender Block von #balken und #content genommen werden sollte. Allerdings haben etliche Formatierungsangaben kleine Nebenwirkungen. Das ganze ist ziemlich deprimierend.

#5

Wie schaffe ich es, dass der container dynamisch mit dem
Textinhalten
des content-Bereichs mitwächst und die Umrandungslinie auch
wirklich
alles umrandet?

Mal nebenbei noch eine Variante, die zumindest bei korrektem Box-Model funktioniert (gut möglich, dass das ganze im IE Probleme macht, das kann ich aber zur Zeit schlecht testen):

#container {
 position: absolute;
 left: 37px; 
 top: 0px;
 width: 740px;
 height: auto;
 border-width: 4px;
 border-style: solid;
 border-color: #E55300;
}
#balken {
 margin: 0;
 padding: 0;
 width: 100%;
 height: 24px;
 border: 1px dotted blue;
 background-color: #efefff;
}
#content {
 width: 100%;
 margin: 0;
 height: auto;
 border: 1px dotted green;
 background-color: #efffef;
}