CSS Div ganz oben an den Rand

[MarkusM]

Hallo,

ich erstelle gerade eine Website und möchte dabei folgendes umsetzen:

der Inhalt der Seite soll mittig ausgerichtet sein und beinhaltete das Menü welches und rechts daneben den Hauptinhalt.

Das ganze sollte jedoch direkt am oberen Bildschirmrand festsitzen. Derzeit habe ich immer einen Abstand am oberen Bildschirmrand.
Dazu habe ich meine zwei DIV Elemente schon mit "top: 0px;" oder "top: 0;" nach oben zu setzen versucht, jedoch klappt dies nur, wenn ich "position: absolute;" setzte.
Das wiederrum hat die Auswirkung, dass die Seite nicht mehr mittig dargestellt wird.

Derzeit schaut das ganze bei mir so aus:
HTML:

  
<div id="main-content">  
   <div class="zeile clearfix">  
      	<div class="menu">Menu</div>  
        <div class="content">Content</div>  
   </div>  

CSS:

  
#main-content {  
	position: absolute;  
	width: 980px;  
	background: red;  
	top: 0;  
}  
  
.clearfix:before, .clearfix:after {  
    content: " ";  
    display: table;  
}  
.clearfix:after {  
    clear: both;  
}  
.clearfix {  
}  
  
.menu {  
    float: left;  
    width: 230px;  
    height: 550px;  
    background: yellow;  
    margin-right: 20px;  
}  
.content {  
    float: left;  
    width: 730px;  
    height: 100%;  
    background: green;  
}  
  
.zeile {  
    margin: 0 auto;  
}  

Vorgestellt hab ich mir das in etwa so wie auf dieser Seite:
http://denoizzed.com/templates/photo/kingsize/multipage/about.html

Klar könnte ich mir diese "Vorlage" auch kaufen, aber ich möchte mir die Website nach meinen Wünschen und Vorstellungen selbst gestalten.