up vote 3 down vote favorite
1
share [g+] share [fb]

A web project I'm currently writing has awful text rendering in Chrome 15.0 on Windows and below, despite text rendering perfectly on all other modern web browsers on both Mac/PC.

Internet Explorer 9:

enter image description here

Chrome 14.0:

enter image description here

The web page is encoded in UTF-8. The font used is Helvetica/Arial/sans-serif. Any suggestions?

PS - wheree isn't a typo.

Update: I've created a test page highlighting the problem, text renders fine in all browsers except Google Chrome on Windows. It's valid HTML/CSS according to the W3C validator.

http://wheree.co.uk/test

link|improve this question
1  
How strange. Could we have a look at your HTML and CSS? (Possibly on jsfiddle.net) – Paul D. Waite Dec 13 '11 at 14:10
1  
This is pretty difficult to analyse without access to the source. – Mankarse Dec 13 '11 at 14:10
@ErnestFriedman-Hill: “it's a Chrome-on-Windows installation issue” — huh, really? – Paul D. Waite Dec 13 '11 at 14:10
@PaulD.Waite -- yep, I've seen machines where Chrome renders all pages like this; nothing to do with the specific site. Might be a settings thing, I'm not sure; it's obviously nonoptimal if the default settings don't work. – Ernest Friedman-Hill Dec 13 '11 at 14:13
@ErnestFriedman-Hill: crikey, you’d think we could figure out decent basic default font rendering in browsers by now. Good spot. – Paul D. Waite Dec 13 '11 at 14:16
show 1 more comment
feedback

migrated from stackoverflow.com Dec 14 '11 at 5:16

This question came from our site for professional and enthusiast programmers.

3 Answers

up vote 3 down vote

This sounds like it could be related to either ClearType or GPU rendering.

Here is a helpful article on how to fix font rendering issues.

link|improve this answer
Yes it's clearly something to do with anti-aliasing, or the lack of it, but it happens on all Windows PC's running Chrome I've seen? It's almost as if Chrome disables ClearType by default? The screen shot is taken from browser lab. I'm looking for a scripting based fix, rather user-end solution. – Ryan Brodie Dec 13 '11 at 15:20
feedback
up vote 2 down vote accepted

This was a problem worthy of StackOverflow after all. CSS Solution:

-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
font-smoothing: antialiased;
link|improve this answer
feedback
up vote 0 down vote

Did you applied an reset.css? Did you verified the computed styles with Chrome?? (Use Chrome Developer Tools for this).

Did you searched this behaviour? Like this post: Chrome is ignoring my font choice

link|improve this answer
I've applied reset.css before my main CSS file. Yes I've searched this behaviour extensively on the internet and haven't found a solution anywhere, so decided to ask on here myself. I just read that post, it could potentially be a CSS error but it seems unlikely because I've seen this rendering issue before. – Ryan Brodie Dec 13 '11 at 15:21
please add your html and css code in your post. – adis Dec 13 '11 at 15:30
Just added the link in the description: wheree.co.uk/test – Ryan Brodie Dec 14 '11 at 16:50
feedback

Your Answer

 
or
required, but never shown
discard

Not the answer you're looking for? Browse other questions tagged or ask your own question.