Decimal places in width using pixels

in Articles

The other day I was designing a nice little tool which will drag and drop divs using the JQuery UI framework, the issue I was having was the difference in browsers on certain measurements. As it was drag and drop it was possible for the user to drag the div to a left position of 100.2px or 150.8px. But obviously you can't exactly position the div to 0.2 of a pixel because that's impossible.

So I asked the question which way does the browser round this measurement, does it round 125.8px to 125px or to 126px. I know this doesn't sound like much of difference in the display but when I am saving these values in the database to be displayed later I want the div to appear exactly where the user placed in, exact position positioning can be important for application such as wireframe programs.

I did some research into this question and discovered the answer and of course the answer is different browsers will handle it differently. Here are the results of from main browsers

Browser 125.2px 125.5px 125.8px
Firefox 125px 126px 126px
Chrome 125px 125px 125px
IE 125px 126px 126px
Safari 125px 125px 125px
Opera 125px 125px 125px

As you can see for these results FireFox and IE will always round to the nearest and the other browsers will always round down.

Subscribe To Newsletter

Get weekly updates to your email