Solved

Text rendering as bold on mac in web browsers

Posted on 2007-11-21
2
1,021 Views
Last Modified: 2012-08-13
Hello,

I've got a problem with text on a website . When viewing it on a Mac in Firefox or Safari or other browsers it appears to render text as bold (even though it will go bolder with font-weight: bold; ).

Can this be fixed? I've tried putting font-weight: normal !important in my CSS but seems to have no effect.

Cheers

Heres a link to the site if you'd like to check your yourselves.
http://www.designjunkie.com/allanlake/furniture_bedroom.php
0
Comment
Question by:sousflai
2 Comments
 
LVL 6

Expert Comment

by:TheKyle
ID: 20331314
I don't have a mac in front of me, but I'm guessing that what you're seeing is caused by the anti-aliasing on a mac.  By default, Windows doesn't have anti-aliasing, but Macs do.

Try enabling "ClearType" in Windows, and see if it makes the text look more like the Mac. (http://support.microsoft.com/kb/306527)

If they look the same or similar, then there really isn't a problem with your css.  It's something that you can't really do anything about.

If they still look drastically different, then I'm not sure what you could do.  I'd probably have to see your html and css to help you more.
0
 
LVL 39

Accepted Solution

by:
Eoin OSullivan earned 500 total points
ID: 20333430
The problem/issue is that you've used a font-family that differes between Mac & Windows
See your master.css
In the body tag you have specified
body {
      background-color : #303030;
      font-family: Helvetica, Arial, sans-serif;
      color: #fff;
}

Helvetica is a Mac-only font and more heavily aliased and slightly rounder than Arial ..
So on a Windows PC you are looking at Arial and on a Mac you are looking at Helvetica .. hence the difference.
Try removing Helvetica from the font-family for a more consistent appearance!!

Change it to ..

body {
      background-color : #303030;
      font-family: Arial, sans-serif;
      color: #fff;
}
0

Featured Post

Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

We could spend the next millennium discussing the differences of the Mac and Windows platforms. The next century will continue to have fanatics on both side of the equation and neither side will win the war. However, that’s not why we are here. W…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question