1 Posted by Gérard Talbot on 5 September 2005

Chad,

1- MS-Script debugger pops up complaining a "object required" at line 113 error message when I load your testcase in MSIE 6.

2- You say that MSIE 6 does not take the border width into account when calculating the offsetLeft/Top JS properties of an element. That may not be entirely true: the border width around the body element is taken into consideration when computing the offset* values.
https://bugzilla.mozilla.org/show_bug.cgi?id=255754

3- MSIE 6 will report a positive offsetLeft value and offsetTop value for the body node and at the same time will report that the offsetParent is null. This is clearly an implementation bug. The definitions provided at MSDN clearly suggests that such incoherence should not exist.
http://www.gtalbot.org/BrowserBugsSection/MSIE6Bugs/OffsetValues.html
I already reported this as a bug at a MSIE product feedback wiki page for IE 7 dev.

4- "Retrieves the calculated left/top position of the object relative to the layout or coordinate parent" means and refers in my mind to the padding-box, not to the border-box. Since a nested element do not overlap its own parent's border, then such assumption seems adequate, reasonable.

5- There is a need for more testing.

2 Posted by Sjoerd van der Hoorn on 21 December 2005

Another workaround for Internet Explorer: use "objectname.offsetTop + objectname.clientTop" to also take the border in account. This does not work in Firefox, since Firefox doesn't contain the .clientTop attribute.

3 Posted by Beau Hartshorne on 20 January 2006

Here are another couple test pages for this problem:
http://hartshorne.ca/2006/01/20/javascript_positioning/

Sjoerd's workaround helps, but I think the best workaround is to avoid padding, margins, and borders or to use nested divs.

4 Posted by Mark Peterson on 2 October 2006

To find clientTop for IE and Firefox, you subtract obj.clientHeight from obj.offsetHeight and then divide by 2. This assumes that your top and bottom borders are of equal height.

var clientTop = (obj.offsetHeight - obj.clientHeight) / 2;