Трёх Колоночный Шаблон Сайта И Css

[borod]

Добрый вечер.
Трёх колоночный шаблон, левая колонка меню, посередине контент.

<div class="left">
<div class="middle">
<div class="right">

Если ставим на каждую колонку ширину в процентах, к примеру

.left{float: left; position: relative; width: 20%;}
.middle{float: left; position: relative; width: 60%;}
.right{float: right; position: relative; width: 20%;}

Все колонки равномерно(соотвествено процентам) увеличиваются или уменьшаются в зависимости от ширины окна браузера.

Как сделать что-бы ширина менялась только у средней колонки, а правая и левая были всегда одинакового размера?
Сделал так:

.left{float: left; position: relative; width: 200px;}
.middle{float: left; position: relative; min-width: 995px; max-width: 1400px;}
.right{float: right; position: relative; width: 200px;}

не работает.

Правая и левая колонка по width: 200px. Надо что-бы средняя колонка менялась по ширине от 995px до 1400px, в зависимости от ширины окна браузера.
Где копать?

 

[1ive]

Правую и левую колонки сделать фиксированой ширины, а для средней не указывать совсем.

И, наверное, всё таки будет правильней так:

<div class="left"></div> 
<div class="middle"></div> 
<div class="right"></div>

 

[borod]

Правую и левую колонки сделать фиксированой ширины, а для средней не указывать совсем.

Пробывал не работает.
Средняя колонка сползает вниз под левую колонку и растягивается по максимуму до краёв браузера, правая колонка сползает под среднюю.
----
Может это поможет:
Данные три колонки находятся в диве

<div class="fb">
<div class="left"></div>
<div class="middle"></div>
<div class="right"></div>
</div>

.fb	{margin: 0 auto; min-width: 995px; max-width: 1400px;}

Может как то можно ограничить ширину средней колонки в промежутке от 950px до 1200px ?

 

[1ive]

"Пробывал не работает."
Вправьте себе руки.

У меня работает.

<style>
.fb  {margin: 0 auto; min-width: 995px; max-width: 1400px;}
.left{float: left; position: relative; width: 200px; background:#ff0000; height:500px;}
.middle{float: left; position: relative; height:500px;}
.right{float: right; position: relative; width: 200px;background:#0000ff;height:500px;}
</style>

<div class="fb">
<div class="left"></div>
<div class="middle"></div>
<div class="right"></div>
</div>

Высота и цвет фона - для наглядности. Удалить перед использованием

 

[borod]

"Пробывал не работает."
Вправьте себе руки.

Тут не руки надо, а мозг вправлять.

<style>
.fb {margin: 0 auto; min-width: 995px; max-width: 1400px;}
.left{float: left; position: relative; width: 200px; background:#ff0000; height:500px;}
.middle{float: left; position: relative; height:500px;}
.right{float: right; position: relative; width: 200px;background:#0000ff;height:500px;}
</style>

<div class="fb">
<div class="left"></div>
<div class="middle"></div>
<div class="right"></div>
</div>[/html]

Высота и цвет фона - для наглядности. Удалить перед использованием

Создал чистую html страницу, проверил на ней - работает, но на сайте не хочет работать!
Что может заставлять среднюю колонку расширяться максимально и сползать вниз под левую колонку ?

Ссылка скрыта от гостей

 

[1ive]

Может проще чем гадать, будет дать адрес сайта?

 

[borod]

Может проще чем гадать, будет дать адрес сайта?

Всем спасибо, нашёл в гугле решение:

<style>
.fb {margin: 0 auto; min-width: 995px; max-width: 1400px;}
.middle{float: left; width: 100%;}
.middlecontent{margin: 0 200px;}
.left{float: left; margin-left: -100%; width: 200px;}
.right{float: left; margin-left: -200px; width: 200px;}
</style>

<div class="fb">
<div class="middle"></div>
<div class="middlecontent"></div>
<div class="left"></div>
<div class="right"></div>