HTML 结构 - 填充 2 个 float div 之间的空间

Question

我正在尝试实现一种布局，其中我有左右浮动的列，中间有一些内容，填充所有可用空间。我可以使用什么标记/CSS 来实现以下目标？我的内容 div 总是错误地包裹在它下面的右侧 float div。

我正在尝试的 fiddle :fiddle

<div style="float: left;">
    left floated content
</div>

<div>
    fill space between left and right floated content
</div>

<div style="float: right;">
    right floated content
</div>

Answer 1

如果那些 float 的 div 是固定宽度的，这就是实现它的方法。

<div style="float: left; border: 1px solid blue; width: 150px;">
    left floated content
</div>

<div style="float: right; border: 1px solid green; width:150px;">
    right floated content
</div>

<div style="margin-right:150px; margin-left:150px;">
    fill space between left and right floated content fill space between left and right floated content fill space between left and right floated content fill space between left and right floated content fill space between left and right floated content fill space between left and right floated content fill space between left and right floated content 
</div>