Вот классический вариант:
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style type="text/css">
* { margin:0px; padding:0px;}
#content{
width:100%; height:600px;
}
#content_left{
width:250px; height:600px;
float:left;
background:#CCC;
}
#content_center{
height:600px;
margin:0 251px;
background:#999;
}
#content_right{
width:250px; height:600px;
float:right;
background:#CCC;
}
</style>
</head>
<body>
<div id="content">
<div id="content_left"></div>
<div id="content_right"></div>
<div id="content_center"></div>
</div>
</body>
</html>
Здесь центральная колонка тянется на всю ширину.
Если вам надо чтобы содержимое сайта было фиксировано, то изменить ширину #content со 100% на фиксированную, при этом конструкция все равно будет работать.
Если честно, то не совсем понятна задача, ибо из названия темы следует одно, а из вашего примера другое.
Что касаемо вашего примера, вы слишком перемудрили, правильно было бы расположить элементы так:
Код:
<body>
<div id="content">
<div id="content_left"></div>
<div id="content_right"></div>
<div id="content_center"></div>
</div>
</body>
при этом не стоит делать #content_center "плавающим", а сделать так как в моем примере.
в вашем css не понятны некоторые строчки:
Код:
#content_center{
position: relative; /*зачем это нужно? хоть оно ни на что не влияет, но может кого-то ввести в заблуждение*/
}
#content_right{
left: 0; /* непонятно зачем это нужно?*/
position: relative; /*аналогично чуть выше*/
}