I know most of my readers (all 2 of you) will probably stare blankly at me over this topic, (I guess this is mostly for the search engines) but IE continues to piss me off, and I need to tell SOMEONE.

Today's problem is IE7's math, and their implementation of kerning. (having wiki'd that, I see I may be talking about tracking, but who cares.)

In css, you use a parameter called letter-spacing to change kerning on things. As with all other css, you can specify the units you want to use as pixels, points, percentages, or em. (there are others.)

An em is essentially the width of a standard 'M' character in your font of choice. For IE's mathematical purposes, it's a percentage of the font size you specified elsewhere.

So if I have a font-size: 12px; for my entire document. I can make my headers: font-size: 1.5em; and they will be displayed 150% of 12px. (18px)

So.. an example.

if you're using any recent browser, that should look all spready...

Now.. I rarely need massive letter spacing like that... (though it does come up.) More often than not, I get handed a nice layout from a pro graphic designer that has text in it that is crammed together, ever so slightly, but it really does change the look of certain things.

in IE.. the best you can do for 'ever so slightly' is this:

that's not so bad in trebuchet or whatever the hell i'm using here, but in an italic serif font, it looks pretty tight. Now, IE can take any unit ABOVE .05.. (or 5%).. which.. in negative kerning terms.. isn't too useful.. but I sleep well at night knowing that I can always choose to do something like:

yeah... that's fabulous.. I'm sure that'll come in handy somewhere.

So, to summarize.. IE7 doesn't seem to know what to do with a negative kerning value below 5%. That may not seem like a big deal to you, but really, within that 5% is all of the most useful kerning you'd normally ever use.. the kerning between 'none' and 'just a bit'.

To break it down to my problem today.. I've got a 24px headline.. 5% of 24px is 1.2 pixels per character.. over 30 characters, that's 36pixels shorter than normal

there ya go.. (if you're using IE7.. the second one will be the same size as the last. those are 5%, 2%, and normal.)

I know most of you think it's a small thing, but this kinda crap is what design folk constantly hit standards nazis like myself with when I'm trying to use html and actual text instead of images to create their web designs.