Why are offsetHeight and offsetWidth intermittently inaccurate?

1.8k views Asked by At

I've been noticing that, at least in Firefox (haven't tested extensively in other browsers yet), the offsetHeight and offsetWidth properties on a <div> might be off by one pixel. (And yes, I'm already accounting for borders, padding, and margin.) Take a look at this screenshot to see what I mean:

Here the total height with borders is 46px, but as Firebug shows the offsetHeight is only 45px

So here the total ACTUAL height with borders is 46px, but as Firebug shows the offsetHeight is 47px (and without borders as 45px). Why the discrepancy? Is that a browser glitch? I should mention that the <div> in question has float: left set on it, and it also has some content inside of it that is similarly floated: left.

1

There are 1 answers

0
Shauna On

Look at your borders (and your math) again. You have a 1-pixel border on all sides of the div, which means a pixel on both the top and the bottom of the div.

1+1=2
45+2=47