I’ve used the CSS attribute letter-spacing to control the amount of space in the titles on my site. They work fine in Firefox, utilizing the following CSS:

h1 { letter-spacing: -.08em }

IE6 doesn’t seem to like negative em values. IE6 actually adds spacing between the characters in this instance. To fix this, I used the * html hack filter to pass an alternate value over to IE6. Not a pretty way of doing it, but it works. Here’s the code I used:

h1 { letter-spacing: -.08em }

* html h1 { letter-spacing: -3px; }

By using a negative pixel value instead of a negative em value, IE6 displays the content properly.

Update … so why this approach? It’s scalable in modern browsers. By using em values, we can scale the letter-spacing based on the size of the fonts, as specified by the user’s settings. Pixel values don’t scale. That’s why we utilize the * html hack to pass the letter-spacing value we want it to have.