Makes sense about Safari, since I work on a Mac. I noticed that the IE browsers were fine but I was having problems with my Mac browsers rendering differently, I can’t remember exactly which one, but from what you say, it makes sense that it was Safari. It’s as as though it was pushing the content down by just a few pixels. The only way I figured it out was by using Adobe Browserlab and using the onion skinning. The place where the onion skins were going off was right at the place where I was using the <b>. I replaced it and all was fine.
You have “bold” because not all fonts (I’d maybe dare say MOST fonts) don’t have all those weights at all. Bold == anything 400 and up. However some of the older font absolutely have a 100 weight, a 400 weight, a 600 weight… so CSS was designed to deal with that, but in the real world, means little. But you type one less character so I’m all for it.
That’s what’s funny about it all. <b> is nice and compact. But it violates the separation of content and presentation semantically. To make the the markup semantic you have to take a nice lean tag, and change it to span or strong, then add class names. Even if you are using strong alone it’s more code than just that little <b>.
Personally I set
strong {
font-weight: bold;
}
I’ve been doing this:
strong {
font-family: ‘ProfessionalTypefaceBoldVersion’;
}
I like to deal with fonts with both the semibold and the bold versions, so I can choose which.