ie6/ie7/firefox/dispaly:inline-block:兼容性
时间:2011-05-20 来源:cumt魏
<div class="update">
文字内容
<div class="order">
<span class="up" title="排序1"></span>
<span class="down" title="排序2"></span>
</div>
</div>
.update{position:relative; display:inline-block; *zoom:1; *display:inline; *overflow:hidden; padding-right:25px;}
.order{position:absolute; top:-2px; right:0;}
由于ff,ie8,chrome 支持inline-block,所以其形成一个内联块,并有一个右边的内边距,所以其子元素的绝对定位right:0;可以做到右边为0,即可相对于左边自适应。
而ie6,ie7不支持inline-block,所以其右边内边距不能用,需要将其设置为display:inline,变为内联元素,然后设置:zoom:1;触发layout,其显示效果为inline-block。
总计:ie6,ie7下display:inline; zoom:1;=====ff,ie8,chrome的inline-block
相关阅读 更多 +