我正在尝试实现一种布局,其中一系列 div 呈现在一行中,其中一些左对齐,一些右对齐。
<html>
<body>
<div width="100%">
<div class="left">item1</div>
<div class="left">item2</div>
<div class="right">item3</div>
<div class="right">item4</div>
</div>
</body>
</html>
.left, .right
{
display: inline-block;
*display: inline;
zoom: 1;
}
.right
{
float: right;
}
</p>
我有上面的代码,它呈现了我在 ie8、firefox、chrome 中所期望的方式。但在 ie7 上,右浮动 div 显示在下一行而不是同一行
我在http://jsfiddle.net/acdara/MEDSy/27/有一个 jsFiddle
我知道另一种解决方案也是浮动左对齐元素,但我真的很想保留内联块的好处,比如不必担心元素脱离流程。
我想知道我是否可以为 ie7 做些什么来保持内联块的优点。