Immer wieder steht man ja beim erstellen von xhtml-Seiten vor dem Problem, dass man zentriert einen Container haben möchte, der eine Höhe von 100% hat und der auch beim Scrollen wirklich bis zum Ende der Seite geht.
Das Klappt mit der Angabe von height:100% und min-heigt:100% alleine allerdings nicht besonders gut wenn man verschiedene Versionen von IE und Firefox verwendet.
Mit diesem CSS sollte es besser klappen:
<style type=“text/css“>
<!–
html, body {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
height: 100%;
}html>body #container {
height: auto;
min-height: 100%;
}#container {
width:600px;
height: 100%;
text-align: left;
background-color:#CCCCCC;
padding: 0px;
margin: 0 auto 0 auto;
}
–>
</style>
Erfolgreich getestet in Internet Explorer 5.5 + 6 + 7, Mozilla Firefox 1.5 + 2, Opera 8 + 9,Epiphany, Galeon
Die Komplette Datei: xsl+css: 100% height auch beim scrollen