为什么IE和Firefox为div返回不同的溢出尺寸？ [英] Why are IE and Firefox returning different overflow dimensions for a div?

问题描述

我有一个固定大小为100像素的 div 。 scrollWidth 和 scrollHeight 是正常的（没有单词长到足以完全填充一行）。但是，如果有任何文本，一个单词的渲染宽度比100px会导致一个问题。

I have a div with a fixed size of 100px. scrollWidth and scrollHeight works fine if the text in the div is normal (no word is long enough to fill the one row entirely). However, if there is any text with one word rendering wider than the 100px it will cause a problem.

假设文本类似ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890：然后Firefox返回错误的 scrollWidth 即使 div 溢出也与实际宽度相同。然而，IE给出正确的 scrollWidth （在这种情况下为180）。

Let's say the text is like "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890": then Firefox returns the wrong scrollWidth (100 in this case, which is same as the actual width even though the div is overflowing). However, IE is giving the correct scrollWidth (180 in this case).

请帮助我在Firefox中获取正确的 scrollWidth 。

Please help me get the correct scrollWidth in Firefox. Sorry if my question looks vague.

推荐答案

确保您的 div 具有 overflow：hidden 或 overflow：auto 样式集。如果它 overflow：visible （默认值），那么FF不会计算更大的 scrollWidth 没有任何要滚动（文本是​​全部渲染）。

Make sure that your div has the overflow:hidden or overflow:auto style set. If it's overflow:visible (the default), then FF won't calculate a larger scrollWidth as there's nothing to scroll (the text is all rendered).

您在IE中观察到的行为实际上是由于 overflow：visible

The behavior you observed with IE is actually due to a bug in that browser's implementation of overflow:visible.

这篇关于为什么IE和Firefox为div返回不同的溢出尺寸？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！