Jquery width $(el).width() 似乎在这里失败了答案

【问题标题】：Jquery width $(el).width() seems to fail hereJquery width $(el).width() 似乎在这里失败了
【发布时间】：2012-09-27 00:35:53
【问题描述】：

有谁知道为什么包含文本“ABC”的跨度宽度返回 0。

1) 仅在 Firefox 中发生。 2）如果我删除两者之间的跨度，它可以正常工作。 (http://jsfiddle.net/3BFGU/30/)

【问题讨论】：

【解决方案1】：

不知道为什么 - 这可能是一个错误；但是，...

默认情况下，Span 不应该有任何宽度属性，当然它们最终会在浏览器呈现它之后进行。你可以做的是让它们成为块状元素，这应该可以解决它：

span { display:inline-block; }

其他有趣的事情是，如果您删除 ABC 跨度和它的包装器之间的所有空白，它将正常工作。这可能与空白和包装有关。浏览器可能无法提供宽度，因为容器可能从一条线开始并在另一条线结束。这也许可以解释为什么将其设置为块可以解决问题，因为将容器设置为块可能会使整个容器保持在一起。

【讨论】：

@sbr：用更多解释更新了答案，这可能会有所帮助。这只是稍微测试一下的推测，所以就当它是什么吧。
我也没有提到你的nowrap css 需要一段时间才能正常工作（.nowrap）
另一个有趣的场景，只有FF。 jsfiddle.net/3BFGU/68 。如果我计算所有跨度的单个宽度并添加它，如果它的宽度设置为 "auto"，那么它会大于外部 div 的总宽度。
对于那种情况，我会使用outerWidth；但是由于某种原因，自动会大 1px - 哦，我忘了，我认为 FF 将宽度计算为浮点数，所以小数点可能会被丢弃，这会影响事情。我依稀记得我必须手动计算宽度（使用 parseFloat 获取边距、填充和边框）
见这里：jsfiddle.net/3BFGU/74 -- 注意：getComputedStyle，对于 IE 来说是不同的，它使用类似currentStyle 的东西，你必须输入你自己的逻辑才能真正获得跨浏览器的东西。为了帮助理解，如果计算样式为auto，则parseFloat 将返回NaN，因此在这些情况下，我指定使用jQuery 的默认width() 函数。另外，我忘了添加边框宽度。