Ok, ich weiß, dass dieses Thema viele Fragen hat, aber ich konnte noch nicht genau sagen, wie das funktioniert. Das ist nah am Problem, aber es funktioniert nicht für mich.
Ich möchte, dass meine Seite 100% Höhe hat. Auf dieser Seite befindet sich ein statischer Header mit einer Höhe von 40 Pixel und ein Inhalt mit der verbleibenden Höhe (100% - 40 Pixel).
HTML:
%Vor%CSS:
%Vor%Dies ist eine Erklärung des Codes:
Ich habe position: absolute zum Inhalt hinzugefügt, weil er sonst aus irgendeinem Grund nicht 100% seines Containers #page einnehmen würde
Dann war das Problem, dass es die Grenzen der Seite überschreitet, weshalb ich top: 0 hinzugefügt habe.
Dann überschneidet sich der Inhalt von #content mit dem Header, also habe ich padding-top: 40px
Jetzt überschreitet der #content erneut die Grenzen der Seite
Irgendwelche Vorschläge? Vielen Dank.
Hier ist ein Artikel über dieses Problem. CSS-Problem mit 100% Höhe
Sie können sehen, dass die Beispielseite ein perfektes 100% -Layout für Kopf- und Fußzeile hat. Es verwendet relative Position und nicht absolut.