我正在尝试实现一种布局,其中左右浮动的列之间有一些内容,以填充所有可用空间。我可以使用什么标记/ CSS来实现以下目标?我的内容div总是错误地将正确的浮动div包裹在其下面。
我正在尝试的小提琴: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>
最佳答案
如果那些浮动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>