IE Percent Bump

IE's Layout Engine Sucks

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam euismod ipsum quis lorem tristique lacinia. Aliquam diam sem, posuere vitae, fringilla sed, euismod in, lorem. Phasellus in turpis vel lacus tristique hendrerit. Fusce pharetra arcu. Phasellus cursus est vel quam. Vestibulum ullamcorper adipiscing nisi. Maecenas facilisis auctor ligula. Aliquam erat volutpat. Etiam lacinia eleifend turpis. Praesent accumsan aliquet diam.

If you're window doesn't already, find out how to show the contents of the screen while dragging the window. Once that's setup, try resizing the screen and watch the left edge of the text in the above light gray box. Notice anything?

The text's left edge is jumping horizontally. WHY IS IT FUCKING JUMPING?!

Let's move the light gray box back to the right by 10 pixels so we can see the underlying dark gray box and try this again.

So it's the light gray box that's jumping around. Well that sucks. What's going on here? My guess is that it's a rounding error, something that IE and Firefox are both notorious for (well Firefox seems to have resolved most of them as of it's 2.0 version). It's probably calculating out the percent value into pixels and coming up with numbers after the decimal point. How does one render a box at 10.33 pixels from the left? Sometimes IE rounds up. Sometimes it rounds down. Thus you get your horizontal skipping. At least that's my theory.

But wait... is it really? Let's get rid of hasLayout on both gray boxes and see what happens:

No horizontal skipping! WHAT THE FUCK IS GOING ON HERE?!