2011-02-22 (updated 2012-05-24)
Reading through the responses to the question: “How to detect page zoom level in all modern browsers?”, I made a script to detect zoom on GitHub.
Also, here's a dimensions test page to try in multiple browsers and zoom levels.
offsetX, etc. When you zoom in, there are fewer CSS pixels available so CSS widths shrink.
event.screenX. Older browsers returned these measurements in device pixels, which don’t change with zoom. Firefox 4 begain reporting these in CSS pixels according to the spec. And then there’s WebKit (Nexus One and iPhone) and IE8, which take this in a crazy bizarre level, where device vendors report whatever they want for
screen.width, and then developers have to convert screen pixels to device pixels using a ratio stored somewhere. So now there are three types of pixel we have to deal with.
width: 100%within the body, how wide will it be? (Formally, the width of block elements within the root block formatting context.)