DIV Container Höhe 100%

Question

Ich hänge mal wieder an einem (vermeintlich einfachen) CSS-Problem. Ich habe zwei Container definiert, die nebeneinander dargestellt werden und dabei jeweils die volle Höhe des Browserfensters einnehmen sollen. Leider ist sowas immer wieder ein Abenteuer, denn die Container sind immer nur so hoch, wie die darin enthaltenen Elemente. Hier mal der Code:

body {
background: #FFFFFF;
margin: 0px;
padding: 0px;
height: 100%;
font-family: verdana;
}

#links {
padding-top: 15px;
width: 250px;
background: #CAD6E6;
color: #0580C4;
text-align: center;
float: left;
border: 1px solid;
}

#rechts {
padding-top: 15px;
width: 130px;
background: #0580C4;
text-align: center;
border: 1px solid;
}

Einfach nur die Höhe mit 100% anzugeben funktioniert nicht. Was hab ich übersehen? Danke! :o)

Answer 1

evtl. Quirksmode?

außerdem:
html {
height:100%;
}
(body kann nicht höher als umgebendes Element sein!)

Answer 2

Der Hinweis hilft mir schon mal weiter. Ich hab zu Testzwecken erstmal den rechten Block ausgelassen und der linke wird tatsächlich über die gesamte Höhe angezeigt - leider aber mit dem "Erfolg", dass nun am Rand des Browserfensters eine Scrollleiste auftaucht, obwohl da (im Prinzip) gar nichts zu scrollen ist. Auf der anderen Seite soll das vertikale Scrollen natürlich nicht grundsätzlich unterbunden werden, wenn eine Seite tatsächlich so viel Inhalt hat, dass eine Bildschirmseite nicht ausreicht.

Answer 3

Les dir am besten mal www.ohne-css.gehts-gar.net/ durch. Da ist das alles recht gut erklärt. Da ist zwar nicht exakt dein Beispiel beschrieben, aber ich denke http://www.ohne-css.gehts-gar.net/0025.php sollte dir weiter helfen.

mfg Friedel