Width 100% of space between floated left and right div - html

Question

I have a div on the left side and on the right side, both fixed width. I have a middle div witch is also fixed width. I want the middle div to stay in the middle of left and right div no matter screen reslolution, so the space from left to mid div and space from mid to right div shold be the same allways. How can i do that?
This is what i got so far:
HTML:
<div id="container">
<div id="left">
</div>
<div id="content">
</div>
<div id="right">
</div>
</div>
CSS:
div{
border: 1px solid black;
height: 200px;
}
#container{
width: 100%;
}
#left{
width: 50px;
float: left;
}
#content{
width: 150px;
float: left;
margin: 0 auto;
}
#right{
width: 100px;
float: right;
}
http://jsfiddle.net/Y5ZCT/

Answer 1

You can position the left and right divs absolutely and have the center div in the middle.
HTML
<div id="container">
<div id="left"></div>
<div id="content"></div>
<div id="right"></div>
</div>
CSS
div {
border: 1px solid black;
height: 200px;
}
#container {
width: 100%;
position: relative;
}
#left {
width: 50px;
position: absolute;
left: 0;
top: 0;
}
#content {
width: 150px;
margin: 0 auto;
border:1px solid #f00;
}
#right {
width: 100px;
position: absolute;
right: 0;
top: 0;
}
JSFiddle