Question

I’m working on a page that has three divs next to each other, each the same height. Is is possible to have the first and third divs a fixed-width (say 175px), and have the middle div adjust it’s width to the remaining space (and can be resized when the window width changes)? I know it can be done with just two divs, but is this scenario with three feasible?

Answer 1

Assuming you have markup similar to;

<div id="leftCol"></div>
<div id="rightCol"></div>
<div id="centerCol"></div>

You could do it like this with CSS;

#leftCol {float: left; width: 175px;}
#rightCol {float: right; width: 175px;}
#centerCol {overflow: hidden;}

See this on jsFiddle; http://jsfiddle.net/meSHp/