Hallo
Wegen der Größe: max 990px (+24px Scrollbar= weniger wie 1024px)
Wegen der Aufteilung:
The Golden Ratio in Web Design | Nettuts+
Golden Ratio Calculator
Zu deinem html: eigentlich ist es doch ganz einfach (und logischer).
Zuerst content, dann sidebar. So wie man es auch sieht/liest.
Beide float:left (achte auf die Breiten ). Oder content left, sidebar right.
EDIT: so sollte es gehen (Werte in der Breite anpassen)
Code:
#main {
float: left;
background-color: #f1faff;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-box-shadow: 0 0 1em #114a6b;
-webkit-box-shadow: 0 0 1em #114a6b;
box-shadow: 0 0 1em #114a6b;
}
div#content {
background-color: white;
padding: 20px 30px;
-moz-border-radius-bottomleft: 15px;
-webkit-border-bottom-left-radius: 15px;
min-height: 600px;
float: left;
width: 700px;
}
div#sidebar {
background-color: #f1faff;
width: 180px;
padding: 20px;
float: left;
}
#footer {
clear: both;
text-align: center;
}
Gruß Manfred