IE7和浮动:右

Question

我有两个同级div：#label和#value。我希望#value div与父母div的右侧对齐。我设定了float:right。但在IE7中，#value div显示在#label div下，而不是在同一行上。我知道的一个解决方案是在HTML中切换#label和#value div的顺序，但这是非常违反直觉的。

还有其他方法来完成这个任务吗？

请不要告诉我“停止支持IE7”。我有访问者谁仍然使用IE7，并没有看到任何严肃的理由，我必须把他们从我的网站。

Answer 1

第一个div占用父元素的整个宽度。

可以向左浮动第一个元素，向右浮动第二个元素，然后在父元素上使用overflow使其包含子元素：

​

#Item { overflow: hidden; border: 1px solid #ccc; }
#label { float: left; }
#value { float: right; }

<div id="Item">
  <div id="label">Label</div>
  <div id="value">Value</div>
</div>

​

Answer 2

试试这个：

<div></div>
<div></div>
css: div{display:inline-block}