Problem bei Spalten mit CSS

[Josef 2]

Ich möchte ein Design mit CSS erstellen.

Das soll sich aus 4 Bereichen zusammenstellen.

Oben und Unten.

Links und rechts.

2 Sachen habe ich die ich nicht kapiere.

1. Warum muss ich im rechten DIV im margin 100 von oben setzen, obwohl im linken DIV nichts gesetzt wird und dort klappt es.

2. und was ich gar nicht verstehe, LINKS ist 30 % aber es ist viel breiter?

http://www.cssdesk.com/UtUHh

<div class="container">
<div class="oben">1</div>

	<div class="links">2</div>
	<div class="rechts">
	
	</div>
	
	<div class="unten">4</div>


</div>

* {
	font-family: sans-serif;
	color: #333333;
	padding:0;
	margin:0;
}

html, body {
    height: 100%;
}

.container{width:80%;margin:0 auto;position: relative;min-height: 100%;}

.oben {height:100px;background:#ff0000;position:fixed;top: 0;width:80%;}
.unten {height:100px;background:#ff0000;position:fixed; bottom: 0;width:80%;}


.links {min-height:200px;background:#0000CC;width:30%;float:left;position:fixed;}
.rechts {min-height:200px;background:#00AA00;width:68%; margin:100px 0 0 32%;padding:0 0 100px 0;}