浮动的标准行为是什么:右浮动:左边？

Question

假设有这样的HTML标签:

?<span>
  <span id='s1'>Text 1</span>
  <span id='s2'>Text 2</span>
</span>??????????????????????????????????????????????????

而css风格是:

?#s1 {
  float: left;
}
#s2 {
  float: right;
}

显示器的标准行为是什么？

在某些浏览器中,我看到了

文字1文字2

在某些版本的IE中,我看到了

文字1

         Text 2

似乎浮动:右边跨度被推到下一行.

Answer 1

现代浏览器会正确计算收缩浮动的宽度，并使它们位于同一行，前提是浮动的宽度不超过父元素的宽度。我相信这是正确的渲染行为。

Internet Explorer ( 5, 6, 7 ) 不会以相同的方式呈现它们，因为它无法计算收缩包裹浮动的宽度，因此除非您明确定义宽度，否则它将把它推到下一行。