Help - Search - Members - Calendar
Full Version: Bold Font On Mac Browsers
Zymic Webmaster Forums > Web Design & Development > Client Side Scripting > HTML and CSS
Gibbons
Hello, when making websites, i discovered that all my text is bold for some reason when viewing on firefox and safari on a mac. Its perfect on a pc. Was wondering if anyone has experienced this and has a solution.

Thanks very much.
Gibbons
Hopefully these images will explain better:

Viewed on any mac browser (FF and Safari):



Viewed on PC browser (FF and IE):



Any ideas?
Alex
If setting "font-weight: normal;" changes nothing then it's probably just the different anti-aliasing. Windows prefers sharper fonts, and Mac prefers more blurred/blended edges. I'm not aware of any way to switch the AA settings in the browser. The other fun thing is that Linux has the capacity to do both of these (though since the Mac one has patents attached it's more likely to be closer to Windows than Mac) and other fun things with fonts.

In the end, you have to deal with the fact that some people prefer to have those more blurred fonts, so you need to make the website work with multiple font appearances.
Gibbons
oh dear. its anti-aliasing then. cry!!!!
Jack
Linux by default also has wider and bolder fonts. This is a problem when coding fixed width layouts because of the text width too.
Gibbons
Its ok now anyway. I just adjusted the widths of the layout and its sorted. Personally I prefer the way a PC displays text. Easier to read in my opinion.

Thanks for the help folks.
IamShipon1988
I'm just a bit curious, what font were you using. Some times mac have the same font as windows but they differ in render. Maybe use a universal-friendly font or have the font load off your site.
Alex
It's not the font, it's the anti-aliasing used when rendering the font. You could use the exact same font, but the different rendering would mean they look different.
IamShipon1988
Well what if we have the font load off our server. Since it already has a render of how the font should look, can we not do that.
CODE
@font-face {
    font-family: somerandomfontname;
    src: url(somefont.eot);
    font-weight: bold;
}

From what I know, @font-face makes the client computer load an external font file which the browser use to render your page. But if I am correct, at the moment, such feature is only available on IE
Martijn
QUOTE(Gibbons @ Dec 22 2007, 04:48 PM) *
Its ok now anyway. I just adjusted the widths of the layout and its sorted. Personally I prefer the way a PC displays text. Easier to read in my opinion.

Thanks for the help folks.


How did you do that exactly? I tried everything, even sifr (but that gave much more problems). I have _exactly_ the same problem. Please reply, i'm getting desperate smile.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2012 Invision Power Services, Inc.