Dave
Dave

Reputation: 732

font rendered poorly in Chrome

I've looked at a couple of different solutions, like setting -webkit-font-smoothing to antialiased and resetting the text-shadow. All to no avail, and this is really bugging me.

font differences: https://i.sstatic.net/49lRW.jpg

firefox and internet explorer, then chrome.

Is this chrome behavior, or (more likely) something I am implementing incorrectly? Either way, any suggestions on what I can do about it?

@font-face{
    font-family: Patagonia;
    src: url('style/patagonia_regular_macroman/Patagonia-webfont.ttf');
    font-weight: normal;
    font-style: normal; 
}

(note: I include the font for IE in a separate IE specific css)

Upvotes: 0

Views: 766

Answers (2)

ericjbasti
ericjbasti

Reputation: 2075

I tried every trick on the web, and then I tried this... not ideal at all, but it worked with the typekit font I was using.

h1{
    background:white;
    -webkit-background-clip:text;
    color:transparent;
}

Upvotes: 0

Garrett
Garrett

Reputation: 301

It's most likely a problem with Chrome rather than your implementation. Chrome has been plagued with font rendering quirks for quite a while now; I know that Jeff Atwood (@codinghorror) has done a few comparisons, but I can't seem to find them at the moment.

I'd recommend just targeting Safari (which also uses WebKit) and wait for the folks at Google to push out a patch.

Upvotes: 2

Related Questions