ich habe untere Template-Achitektur aufgebaut.
Nun möchte ich dass der "main-container" mit dem Inhalt nach unten mitwächst aber immer mindestens bis zum unteren Bildschirmrand geht.
Aktuell wächst er zwar mit, aber hat immer nur die Höhe vom Inhalt (also falls nur ein Wort darin steht hat er auch nur die Höhe von einer Zeile...)
irgendwo steh ich auf dem Schlauch
hat wer eine Idee?
hier der code
Code: Alles auswählen
<div id="wrapper">
<div id="header"><h1>header</h1></div>
<div id="line1"><h1>line1</h1></div>
<div id="navigation-top"><h1>navigation-top</h1></div>
<div id="main"><h1>main</h1></div>
Code: Alles auswählen
html, body {
background-color: #333333;
margin: 0;
padding: 0;
height: 100%; /* WICHTIG!!! STRECKT ANZEIGENBEREICH AUF 100% */
}
h1 {
margin: 0px;
padding: 0px;
}
#wrapper {
background-color: #FFFFFF;
width: 970px;
margin: auto; /* Div soll zentriert werden */
min-height: 100%; /* Mindesthöhe für moderne Browser */
height:auto !important; /* Important Regel für moderne Browser */
height:100%; /* Mindesthöhe für den IE */
overflow: hidden !important; /* FF Scroll-leiste */
}
#header {
background-color: #FF0;
height: 150px;
}
#line1 {
background-color: #0F0;
height: 50px;
}
#navigation-top {
height: 80px;
background-color: #06F;
}
#main {
background-color: #CC6;
height:100%;
min-height: 100%; /* Mindesthöhe für moderne Browser */
}
Schönes Problem 
