wahsaga: 100% Höhe will nicht

Beitrag lesen

hi,

<body style="height:100%;margin:0;padding:0;">
<div style="height:100%">
<div>Hier ist die Kopfzeile.</div>
<div style="height:100%;">
  Und hier der Inhalt.
</div>
</body>

Funktioniert so leider nicht. Das untere Div ist zwar exakt so hoch wie das Browserfenster - dadurch entsteht aber eine vertikale Scrollleiste, weil die Höhe der Kopfzeile scheinbar nicht berücksichtigt wird und auf die Gesamtlänge addiert wird, sodass beides zusammen doch länger als das Browserfenster ist.

Works as desigend.

Kann mir jemand den Fehler zeigen?

Dein Fehler muss wohl im Verständnis davon, worauf sich Höhenangaben in Prozent beziehen, liegen - http://www.w3.org/TR/CSS21/visudet.html#the-height-property

Warum entsteht die Scrollleiste?

Weil 100% plus X > 100% ist (für X > 0).

Wenn die Kopfzeile eine bekannte Höhe hat, könntest du sie durch absolute Positionierung aus dem Fluss nehmen - und den ersten Inhalt des Divs dann per margin-/padding-top auf Abstand halten.

gruß,
wahsaga

--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }