Либо так:
HTML
<style type="text/css" media="all">
#carrier{width:800px; font-family:Tahoma; margin:auto;}
#header{background:#066; text-align:center; font-size:28px; font-weight:bold;}
#main{background:#663; width:400px; height:150px; text-align:center; float:left;}
#left{width:200px; position:relative; background:#966; height:150px; float:left;}
#right{width:200px; background:#966; height:150px; float:left;}
#footer{background:#066; text-align:center; font-size:28px; font-weight:bold; clear:both;}
</style>
<div id="carrier">
<div id="header">Тут будет лого</div>
<div id="left">Левый блок</div>
<div id="main">Блок для новостей</div>
<div id="right">Правый блок</div>
<div id="footer">Тут будет низ</div>
</div>
Kибо так:
HTML
<style type="text/css" media="all">
#carrier{width:800px; font-family:Tahoma; margin:auto;}
#header{background:#066; text-align:center; font-size:28px; font-weight:bold;}
#main{background:#663; height:150px; text-align:center;}
#left{width:200px; position:relative; background:#966; height:150px; float:left;}
#right{width:200px; background:#966; height:150px; float:right;}
#footer{background:#066; text-align:center; font-size:28px; font-weight:bold; clear:both;}
</style>
<div id="carrier">
<div id="header">Тут будет лого</div>
<div id="left">Левый блок</div>
<div id="right">Правый блок</div>
<div id="main">Блок для новостей</div>
<div id="footer">Тут будет низ</div>
</div>
И в том и в том случае правильно, зависит от потребностей.
Отличия:
Первый пример - мы слепили поочередно все три блока прижав их друг к другу влево (расположение блоков в таком случае обязательно по порядку: левый, центральный, правый).
Второй пример - Мы указали что левый блок прижат к левой стороне, а правый к правой (расположение блоков в таком случае как угодно, но левый и правый должны быть рядом, а лишь после них идти центр: левый, правый, центральный или правый, левый, центральный).
Можно конечно намудрить и еще кучу методов, но эти два самые простые.
