我有一个标题,其中包含左侧、中间和右侧的元素。为了实现这一点,我有一个浮动左 div、一个浮动右 div 和一个边距 0 自动 div,如下所示:http: //jsfiddle.net/huggz/uuq4Z/1/
<div style="text-align: center;" >
<div style="width: 200px; height: 100px; background: red; float: left;"></div>
<div style="width: 100px; height: 100px; background: blue; float: right;"></div>
<div style="background: green; margin: 0 auto; display: inline-block;">
<div style="width: 150px; height: 100px; background: orange;"></div>
</div>
</div>
我将中间 div 设置为 inline-block 以尝试允许中间内容的宽度变化。但是,这样做会产生边距:自动处理浮动元素,就像它们实际持有空间一样。如果左边比右边宽,我最终会得到一个稍微(或不那么轻微)偏离中心的中间元素。
有没有办法做我想做的事情,最好不求助于脚本。如果需要的话,我宁愿只处理使中间列固定宽度的后果。
[编辑] 我应该提到,有些情况下不存在中间或正确的内容。