internet-explorer-6 - ie6 float:right display:inline-block(display:inline)

Question

如何display:inline-block(display:inline)修复float:rightin ie6？

代码在：http: //jsfiddle.net/VGAGt/

html

<div>
    text<span>>></span>
</div>​

css

div{
    float:left; 
    width: 300px;
    height: 20px; 
    padding:5px;
    background:#ccc;
}
span{
    float:right;
    width:20px;
    height:20px;
    display:inline-block;
    zoom:1;
    *display:inline;
    cursor: pointer;
}​

Answer 1

您的文本在 IE6 中占据整个 div 的宽度，这就是 span 换行的原因。一种选择是将文本包装在 ap 标签中，将其浮动到左侧并通过将宽度设置为 200px 或类似的值来控制其宽度。

HTML

<div>
  <p>text</p><span>>></span>
</div>

CSS

p {
  float:left;
  width:100px;
}

这是jsFiddle。