Safari 3 - CSS hack

A quick tip about how to set up a CSS rule for Safari (all versions) only.

Problem: The way Safari renders some fonts is different from IE or Firefox (exemple: courier).

For courier, the bold version renders well in Safari, but not in IE or Firefox. And I had to ensure that the font would be normal in IE or firefox, and bold in Safari.

The "#" hack doesn't work with Safari 3 beta, but is the one which is the most popular. The following post offers alternative hacks which work with all versions of Safari:
http://www.evotech.net/blog/2007/06/targeting-safari-30-with-css/

Note: the javascript one is probably the best bet
Safari is the only browser that supports the window property devicePixelRatio. So, similar to that old fashioned document.all, you can browser sniff this way:

<script type="text/javascript">
isSafari3 = false;
if(window.devicePixelRatio) isSafari3 = true;
</script>

Other solutions rely on the fact that some CSS properties are only supported by Safari at the moment (but may very well be supported in the future).

-------------------------------------------------------
Conclusion: only use safe web fonts. Once you start looking into using non standard stuff, you get into a lot of hassle....