nicht angemeldet
Hallo,
ich möchte ein zwei Spaltenlayout mit div-Container erstellen, allerdings muss der linke Container über die gesamte Seite gehen (und auch immer dargestellt werden).
Ein normales height:100% funktioniert leider nicht.
Also was ich möchte:
Würde man dies mit Tabellen lösen, sähe das ganze so aus:
<table width="100%" height="100%">
<tr>
<td bgcolor="red" width="150">Linke Spalte</td>
<td>Rechte Spalte</td>
</tr>
</table>
Dort ist im Browser die gesamte linke Seite der Seite rot, egal wie viel Text in der rechten Spalte steht.
Wenn in der rechten Spalte nur sehr wenig Text steht, dann ist dennoch die gesamte linke Bildschirmseite rot.
Steht in der rechten Spalte aber sehr sehr viel Text, so dass man scrollen muss, bleibt dort das rot enthalten.
Nun wollte ich dies mit CSS nachbauen:
<div id="wrap">
<div id="links">Linke Spalte</div>
<div id="rechts">Rechte Spalte</div>
</div>
CSS:
html, body { height: 100%; }
#links {
display:block;
float: left;
height: 100%;
background: red;
width:150px;
}
#rechts {
margin-left: 150px;
}
Das Problem ist, zwar ist die linke Hälfte komplett rot ausgefüllt, scrollt man aber weiter runter (da in der rechten Spalte zuviel Text steht), dann hört das rot der linken Spalte auf und man sieht die weißen Hintergrund.
Weiß jemand, wie man dieses Problem löst?
Ich habe schon diverse Artikel (durch Google gefunden) durchgelesen, keiner hat aber noch wirklich weitergeholfen oder ich hatte andere unangenehme Nebeneffekte, z.B. dass dort Scrollbalken entstanden obwohl keine Nötig waren, da die Seite noch rund 50px länger war.
Wäre echt klasse, wenn mir jemand helfen könnte.
Grüße
Klaus