CSS Font Color Rendering Problem

adachi · #1 (**permalink**) 03-26-2008, 03:35 PM

The following code will not render the proper font color in Firefox or Netscape, but works fine in IE.

<p style="color:#9F4D21; font: bold 20px/1.5em verdana, sans-serif;">DON'T FORGET OUR EVENT ON</p>

If you lower the font size to 16px or lower it works fine.

<p style="color:#9F4D21; font: bold 16px/1.5em verdana, sans-serif;">DON'T FORGET OUR EVENT ON</p>

Anyone know what is going on or if there is a workaround?

Any help is greatly appreciated.

ran_dizolph · #2 (**permalink**) 03-26-2008, 04:32 PM

Perhaps take your font elements out of shorthand to see if it works properly...that's what i'd check first.

Dubbya · #3 (**permalink**) 03-26-2008, 05:02 PM

Try changing the style to this:

Code:

<p style="color:#9F4D21; font: 20px/1.5em verdana, sans-serif; font-weight:bold;">DON'T FORGET OUR EVENT ON</p>

adachi · #4 (**permalink**) 03-26-2008, 05:05 PM

I've tried all variations, but for some reason going from 16 to 18px forces the color to change to blue only in Firefox and Netscape. If I use a different hex color then it will work in some instances, but certain colors ranges still change to blue.

The orange used in this instance goes with an overall marketing color pallete so I don't have an option to change it.

DrayScherm · #5 (**permalink**) 03-27-2008, 05:29 PM

I created this style in the head of the an html doc:

<style type="text/css">

</style>

I then applied it to the text DON'T FORGET OUT EVENT ON with this code:

<body class="dontforget">

It worked fine in IE 6 and Firefox 2.0.0.12.

I did not include the /1.5 em which Dreamweaver told me was not supported syntax.

...Duane

Orion · #6 (**permalink**) 03-27-2008, 05:42 PM

doing it in long hand font-size:1.5em; should work just fine.. px should never be used for fonts. ems is the correct syntax for font size.

DrTandem1 · #7 (**permalink**) 03-27-2008, 09:28 PM

Both look the same in my browsers (a shade of brown). Maybe it's your monitor?

adachi · #8 (**permalink**) 05-30-2008, 06:44 PM

So finally figured it out. There is a bug with Firefox and Catalyst drivers which cause the font colors to render incorrectly.

Web site colors are wrong

Turning on Cleartype fixed it.

PosterManiac · #9 (**permalink**) 06-01-2008, 02:03 AM

Quote:

Originally Posted by adachi

So finally figured it out. There is a bug with Firefox and Catalyst drivers which cause the font colors to render incorrectly.

Web site colors are wrong

Turning on Cleartype fixed it.

Thats exactly what I was about to suggest . I had encountered this problem as well once. Had taken me a lot of googling before I found the solution

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Link color problem	ncriptide	Graphics & Design Discussion Forum	6	02-01-2008 04:00 AM
Problem with Arial Font on PC	dharrison	IT Discussion Forum	1	02-10-2006 07:28 AM
problem with font and font sizes...	jdyndale	Accessibility and Usability Forum	5	01-20-2006 06:39 AM
MSIE 6 Font Problem	webmasterjunkie	IT Discussion Forum	2	05-05-2005 03:07 PM
A Font Color Problem: www.victorian-music.com	Najoba	Graphics & Design Discussion Forum	7	11-10-2004 07:16 PM