[X-Tractor]

Hi erstmal,
dies ist mein erster Beitrag und ich habe gleich ein (für mich) schwieriges Problem.
Um dieses Problem besser verdeutlichen zu können, habe ich eine kurze Skizze dazu gemacht:


Ich möchte auf einer Seite die linke Seite komplett von oben nach unten
mit einer Farbe haben; außerdem am rechten Rand einen Border.
Die rechte Seite soll in einer anderen Farbe sein. In diesem Container soll jetzt wieder ein anderer Container rein, der Text2 (auf dem Bild).

Dies habe ich versucht über CSS zu lösen, allerdings komme ich nicht ganz
weiter. Weil entweder ich benutze %-Angaben, was aber dazu führt, dass die
einzelnen Container nicht genau aneinander liegen oder ich mische %- und px-Angaben, was aber dazu führt, dass die Seite falsch angezeigt wird, wenn die Auflösung eine andere ist.

Das habe ich in der CSS Datei:

html, body	{
	margin:0;
	height:100%;
	background-color:#0012FF;
	
	}

.links 	{
		background-color:#000000;
		height:100%;
		width:30%;
    		float:left;
		border-right:2px #fff solid;
		padding:0;
		}

.rechts	{
		background-color:#0012FF;
		height:100%;
		width:70%;
		float:right;
		margin-top:0px;	
		padding:0;
		}

.text2 {
               background-color:#CCCEED;
               height:100px;
               width:100%;
               border-top:2px #fff solid;
               border-bottom:2px #fff solid;
               margin-height:100px;
         }

In die HTML Datei habe ich folgendes geschrieben:

<div class="links">
Text 1 hierin.
</div>

<div class="rechts">
<div class="text2">
Text2 bla bla bla
</div>

Und hier alles andere an Text hin...
</div>

Aber so funktioniert das nicht so, wie ich es mir vorstelle. Es sollte dann ja auch noch so sein, dass wenn jemand eine andere Auflösung hat, es dennoch noch irgendwie passt, nur kleiner wird.

Ich hoffe ihr könnt mir irgendwie helfen...

Vielen Dank schonmal![/quote]