как сделать 2 div боковой панели фиксированной ширины и 1 main div гибкой ширины?

Question

в основном мой HTML-код выглядит так:

 <div id="leftbar"></div>
 <div id="content"></div>
 <div id="rightbar"></div>

как мне кодировать его с помощью css, чтобы все 3 элемента div были расположены рядом, а левая и правая панели имели фиксированную ширину, а содержимое было гибким для заполнения веб-браузера.

Answer 1

Попробуйте это: http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

Как насчет этого: http://www.glish.com/css/7.asp

Answer 2

Плавающая левая панель слева и присвойте контенту значение left-left, равное (или больше) ширины левой панели. Плавающая правая панель справа и присвойте контенту значение right-right, равное (или большее) ширине правой панели.

.nav1    { width:200px; float:left; }
.nav2    { width:200px; float:right; }
.content { margin:0 210px; }
.clear   { clear:both; }

-

<div id="wrapper">
  <div class="nav1">Main Nav Items</div>
  <div class="nav2">Other Nav Items</div>
  <div class="content">Content goes here</div>
  <div class="clear"></div>
</div>

Answer 3

Теперь у css есть модель flexbox.

Вы должны прочитать спецификацию, чтобы получить гибкий макет веб-страницы

http://www.w3.org/TR/css3-flexbox/