This is my site:
It looks fine in Safari and Chrome but for some reason in Firefox some of the headers are being made bold and the whole thing looks very ugly (see the artists page for example). The word bold doesn’t occur once in the CSS, why is it doing this? I tried adding ‘font-stretch: condensed’ to the css and that worked okayish when i didn’t have any other fonts in the font family, just arial, (which i don’t want… I picked those fonts for a reason), but as soon as i put other fonts in the font family it went ugly again.
Also, you’ll notice if you open the site in Firefox, the text of the top header has been shunted down. I can’t think of any reason for that, but it means I’ve had to remove the page titles in the black band across the top of the main part to accomodate it. The sidebar looks horrible in Firefox too.
IE7: I used netrenderer which I’m going to assume is accurate. The font in that is disgusting. I’m sure I never picked it. In IE6 it’s an enormous mess and I don’t even know where to start!
I tried everything: truetype, Google font directory, font-stretch in the CSS… FF and IE7 seem hellbent on me using fonts wider than a fat ass and it’s not cool.
Hopefully someone can help a brother out.
- The topic ‘Browser incompatibility: fonts and positioning’ is closed to new replies.