All this time and I didn't realize that my site never looked right in IE 5 on PC. As people who do a lot of CSS know, the box model on IE 5 for PC is jacked and in order to make everything happy, you need to use a CSS hack to get all of your sizes right when using padding or margins on an element (since IE puts padding/margins inside the box instead of outside like it's supposed to).

Well, for the longest time I've been using something like:

div.content {
  padding: 50px;
  height: 400px;
  voice-family: "\"}\"";
  voice-family: inherit;
  height: 300px;
}

The little "voice-family" lines are supposed to trick IE and give you the right height you want. The only issue is, it sometimes also screws up the following class as well, and isn't always an exact science. Of course I had to figure this out the hard way.

Thankfully, there's an even better box model hack, that's easier, and seems (in my tests) to work all the time:

div.content {
  padding: 50px;
  height: 400px;
  he\ight: 300px;
}

See that forward slash before the "i" in "height"? That's it, that's the hack. Just put the slash after the first letter of the property. The line w/ that slash in it is ignored by IE5, but works just fine in any other browser that gets the box model correct. There is of course one caveat, but it's a small one. The letter following the slash can't be the letters A-F, or the browser will think it's hex code, and well, you don't want it to do that. This is why it's not before the "e" in "height", and instead precedes the "i".

All in all a nice find, and you IE5/PC users should finally be seeing things the way they were meant to be seen for a change.