Bug 28915 - Fonts loaded with @font-face lose antialising after rendering non-antialiased text
Summary: Fonts loaded with @font-face lose antialising after rendering non-antialiased...
Status: RESOLVED DUPLICATE of bug 67996
Alias: None
Product: WebKit
Classification: Unclassified
Component: Text (show other bugs)
Version: 528+ (Nightly build)
Hardware: Macintosh OS X 10.5
: P2 Normal
Assignee: Nobody
Keywords: InRadar
: 57490 (view as bug list)
Depends on:
Reported: 2009-09-02 12:33 PDT by Brian Campbell
Modified: 2012-01-18 14:03 PST (History)
7 users (show)

See Also:

example of the bug (1.82 KB, text/html)
2009-09-02 12:33 PDT, Brian Campbell
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Brian Campbell 2009-09-02 12:33:48 PDT
Created attachment 38937 [details]
example of the bug

If you use a web font loaded with @font-face, and have a span of text rendered without anti-aliasing (for instance, Monaco 9px), followed by text rendered using the remote font, the text rendered in the remote font will also lack anti-aliasing. The text will continue to lack anti-aliasing until you use a local font again, that is anti-aliased. This bug occurs with several different web fonts that I tested, and several different local fonts at sizes small enough to disable anti-aliasing, and several different local fonts at larger sizes that caused anti-aliasing to be restored.

This bug is present in the wild, for example on http://www.zeldman.com/superfriends/guide/ , assuming you have your fixed-width font set to a small enough size (I have mine set to monaco 9px).

I've attached an example that demonstrates the problem, with several different variations of the problem showing up.
Comment 1 Amadeus 2010-05-11 11:35:28 PDT
I have found an interim fix for this, just apply:

-webkit-text-stroke-color:rgba(0, 0, 0, 0);

To any elements that give yout he problem.
Comment 2 Alexey Proskuryakov 2010-05-12 13:47:55 PDT
This is still reproducible with nightly builds.
Comment 3 Alexey Proskuryakov 2010-05-12 14:03:47 PDT
Comment 4 Mihai Parparita 2011-07-04 12:20:27 PDT
Just ran into this in the wild with: http://www.newyorker.com/reporting/2011/07/11/110711fa_fact_auletta

(caused by the "THE NEW YORKER REPORTING & ESSAYS" 8pt text before the headline)

Selecting the headline text renders it anti-aliased, so in at at least some rendering paths the code is correct.
Comment 5 Mihai Parparita 2011-07-04 12:22:19 PDT
*** Bug 57490 has been marked as a duplicate of this bug. ***
Comment 6 mitz 2011-09-27 11:23:11 PDT

*** This bug has been marked as a duplicate of bug 67996 ***