min-height funktioniert nicht ;(

[Gunnar Bittersmann]

Hello out there!

<div id="contentcenter">
  <div id="main">
  </div>
</div>

html, body {
height:100%;
}
#contentcenter {
min-height:90%;
}
#main {
min-height:85%;
}

Warum funktioniert das so nicht?

Wegen:

„<percentage>
    Gibt einen Prozentwert für die Ermittlung des berechneten Werts an. Der Prozentwert wird relativ zur Höhe des umschließenden Blocks der erzeugten Box berechnet. Ist die Höhe des umschließenden Blocks nicht explizit angegeben (das heißt, sie ist von der Inhaltshöhe abhängig), wird der Prozentwert als 'auto' interpretiert.“ [CSS2 §10.7]

#contentcenter ist also mindestens 90% der Höhe von body hoch, prima, das ist auch so (wie du durch eine Hintergrundfarbe sehen kannst).

Die Mindesthöhe von #main richtet sich nach der _Höhe_ von #contentcenter, die aber nicht angegeben ist! Folglich wird sie als 'auto' interpretiert.

See ya up the road,
Gunnar