IE7中的浮动跨度强制父div扩展到100%可用宽度



我在Stack Overflow中浏览了类似的问题,但都没有解决问题:

http://jsfiddle.net/2SGCb/12/

我的跨度太大:

<span class="in_bl right">Right</span>
<span class="in_bl left">Left</span>

我需要以相反的顺序显示它们,这就是我浮动它们的原因。这适用于除Internet explorer之外的所有浏览器。

请看一下IE中的这个小提琴:http://jsfiddle.net/2SGCb/12/

实际上有两个问题:

a) 单词"右"浮动到窗口的最后

b) 单词"左"one_answers"右"现在都出现在第二行,而不是第一行。

在html中,代码"Right"必须位于"Left"之前(因此strip_tags()应导致"Right Left"),但用户必须看到"Left Right"。欢迎任何其他关于如何在视觉上(但不是在html代码中)交换太跨的建议。

a) 单词"右"浮动到窗口的最后

不要将一个元素向左浮动,另一个元素向右浮动,而是将它们都向左浮动。然后创建HTML结构以满足您的布局需求演示

例如,我交换了这些并将它们向左浮动:

<span class="in_bl left">Left</span>
<span class="in_bl right">Right</span>

b) 单词"左"one_answers"右"现在都出现在第二行,而不是第一行。

在IE7中使用display: inline-block时,必须包含*display:inlinezoom:1才能触发"hasLayout"并使其工作。