offsetHeight returns too small height when wrapped by font tag




13 years ago
9 years ago


(Reporter: dlong, Unassigned)


1.5.0.x Branch

Firefox Tracking Flags

(Not tracked)


(Whiteboard: [CLOSEME 5-15-2010], URL)


(2 attachments)



13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv: Gecko/20060426 Firefox/
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv: Gecko/20060426 Firefox/

In this first example,
offsetHeight corrects returns the height of a span node.

However, when it gets wrapped in a tag like "font", "b", "i", "em", "strong", or anything that changes rendering (but not a "span" or "div"), as in this example
offsetHeight returns the wrong height. It seems to only return the height of the first line.

IE returns the same value for both pages. Mozilla exhibits this problem in both Windows and Linux. Is there at least some work around?

Reproducible: Always

Steps to Reproduce:
1. Open strange_1.htm
2. Click "Run"
3. Open strange_2.htm
4. Click "Run"

Actual Results:  
Height for strange_1's pagagraph is around 100, which is correct. Height for strange_2's paragraph is close to 20, which is the height of only one line.

Expected Results:  
The heights should be the same.
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9a1) Gecko/20060522 Minefield/3.0a1

Same result with latest trunk.

Comment 2

13 years ago
Something else that may be helpful, I just realized that nodes exhibiting this problem, those that return only one line's worth of height for their offsetHeight, all have .parentNode.clientHeight = 0. Perhaps the parent thinks there's no room for the child node so it pretends only one line is renderable? As expected, "font", "b", "i", etc act like bad parents, while "div" and "span" do not.

Comment 3

13 years ago
Probably a duplicate of bug 306428

Comment 4

11 years ago
Created attachment 304054 [details]
Test case shown offsetHeight error when a nested span wraps.

Open the html file, use a large font, resize the window so the that sentence wraps from one line to the next.  The page displays the offsetWidth and offsetHeight, note that the height of the first sentence (in a nested spans) has an offsetHeight of only one line of text, whereas the second sentence, which is in only one span, shows a height of two lines (twice the other height).

Comment 5

11 years ago
Created attachment 304055 [details]
Screen shot of testcase showing incorrect offsetHeight

Comment 6

11 years ago
I see the same problem (except it does occur in <span>s.  In my testcase, there are two identical divs containing identical spans, except span in the first div is wrapped inside a second span (id="11" in the testcase).

Open the testcase html file, use a large font, make the browser window narrow enough that the sentence wraps from one line to another.  The page reports the offsetWidth and offsetHeight of the inner span with different results.
This bug was reported on Firefox 2.x or older, which is no longer supported and will not be receiving any more updates. I strongly suggest that you update to Firefox 3.6.3 or later, update your plugins (flash, adobe, etc.), and retest in a new profile. If you still see the issue with the updated Firefox, please post here. Otherwise, please close as RESOLVED > WORKSFORME
Whiteboard: [CLOSEME 5-15-2010]
Version: unspecified → 1.5.0.x Branch
No reply, INCOMPLETE. Please retest with Firefox 3.6.x or later and a new profile ( If you continue to see this issue with the newest firefox and a new profile, then please comment on this bug.
Last Resolved: 9 years ago
Resolution: --- → INCOMPLETE
You need to log in before you can comment on or make changes to this bug.