以下
HTML:
<div style="white-space: pre"> long time; <span style="float: right;">// kNow C?</span> </div>
在WebKit和Gecko中呈现不同的内容.使用WebKit,跨度的内容与前面的文本保持在同一行,但是使用Gecko,它们将移动到新行.
哪种行为是正确的,为什么?
解决方法
我会再试一次这个答案……
white-space pre指令从字面上解释了白色空间.浏览器显示换行符,空格和制表符(br标签也被视为换行符).所以
<div> hello world</div>
…显示为
hello world
float:right指令将元素从正常的文本流中取出,并将其置于其容器的右侧,指示文本和元素应该环绕它.
Firefox将水平填充可用空间,因此浮动的div将进入下一行. Chrome不会选择这样做并将浮动元素保持在同一行(尽管两个div都显示为块,因此显示为完整的可用宽度).这解释了你的不同之处看到这个小提琴.
由于white-space:pre指令告诉浏览器逐字地解释随后找到的每个字符(因为如果你查看源,可能会显示,减去标记),投入一个向右浮动的跨度可能会引导你进入麻烦.两者都没有表现不正确,这是混合在一起的CSS元素的结果,而这些元素实际上并不是混合的.