claviska
claviska

Reputation: 12480

$(document).width() vs. $('BODY').width() in IE9

I'm working on a type of 'spotlight' plugin that puts four boxes around a target element (top, left, bottom, and right). Thus, the boxes need to be positioned and sized programmatically.

I've come across an instance where $(document).width() returns a consistent value in Firefox, Chrome, IE7, and IE8, but not in IE9—the value in IE9 is 17px greater than the others. However, if I switch it up to $('BODY').width() the value becomes consistent in ALL browsers. Unfortunately, I can't post a fiddle of this because I can't replicate it outside of the development environment.

What might be causing this inconsistency between the body and document width...and ONLY in IE9 (remember, IE7/8 aren't affected)? I've verified standards mode and the padding/margins are zeroed out for HTML/BODY.

Upvotes: 2

Views: 306

Answers (1)

sg3s
sg3s

Reputation: 9567

I think that the extra 17px you experience is the y scrollbar, which you don't normally have in jsfiddle, and counts towards the document but not the body.

Yes this is due to browsers not implementing the box model / standards consistently. Theres not much you can do about it except work arround it.

Upvotes: 3

Related Questions