Reputation: 732
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
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
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