Fix inconsistencies in datagrid header widths across browsers.
Review Request #7212 — Created April 16, 2015 and submitted
We've had this annoying quirk we've tried working around in the past that resulted in an additional pixel of width for the table header in datagrids. The workarounds required very specific situations, and generally, was still incorrect across different browsers. The problems had to do with browser differences in handling subpixel calculations. When rendering a page, a browser may need to assign fractional pixel values to elements before they round them (which different browsers do differently -- ceil vs floor vs round). jQuery will then "helpfully" give us rounded values as well. The end result is that we're very unlikely to have consistent pixel values between the original table and the header we construct. The good news is that tables do not end up with fractional pixel values. This leaves the datagrid containers. We now force these to have rounded pixel widths (taking the ceiling of the value), ensuring that all math and layout performed will have consistent, correct values. This lets us get rid of the various -1 hacks we've placed in CSS and JavaScript. (In fact, without fixing those, we'll end up with off-by-ones again.) Future changes will eliminate those.
Tested in Retina and non-Retina displays with Chrome, Firefox, and Safari.
No more off-by-ones.