Wrong offsetWidth on absolute elements

When an element is positioned outside its parent element, Mozilla gives 0 as offsetWidth, Opera -1.
Mozilla also gives incorrect values, when some part of element is on the border of element. It gives back the size of "visible" area in parent element. So when half is in and half out, it gives half of the real width.

Test page Workaround is not included
Reported by: Mojmir Nebel.

Mozilla, Opera | Reported on 3 August 2005.

This site is no longer maintained. I’m sorry, but it’s just too much work for too little return. You can continue to browse old bug reports, though.




Search reports by browser:

Atom RSS

Comments

(Add your own)

1 Posted by jaap on 3 August 2005 | Permalink

This seems to have been fixed in the new Firefox (1.1/1.5) nightlies. I get 82/20 for both div's.

2 Posted by Patrick on 16 August 2005 | Permalink

There was (is) a very similar problem in earlier Gecko versions in RTL mode (where all absolute positioned Divs would report wrong offsetWidth). Solution was to put the element into an LTR container (via DOM, even if it´s offscreen), compute it´s width, and use that value for RTL mode as well. I guess something similar would work here.

https://bugzilla.mozilla.org/show_bug.cgi?id=65548 is one of many Bugzilla entrys on offsetWidth, and a "solution" is in it as well.

3 Posted by Gérard Talbot on 5 September 2005 | Permalink

As far as I can say and see, this bug has been fixed for quite some time now in Firefox and in Mozilla (seamonkey 1.x). I get 82 and 20 for both divs.
The bug is still there though for Opera 8.02 build 7680

4 Posted by Paul Poley on 5 December 2005 | Permalink

Try something among these lines to fix it for Firefox 1.0:


var html = "123, 456, 789";
var width = 30;

absoluteElement.innerHTML = html;

//Firefox 1.0 gives the wrong offsetWidth on absolute elements, so we make our way around that
{
var t = document.createElement('table');
var r = t.insertRow(0);
r.insertCell(0).innerHTML = html;
t.style.width = width+"px";
document.body.appendChild(t);
absoluteElement.style.width = t.offsetWidth+"px";
document.body.removeChild(t);
}