CODEWITHSUNDEEP
google-chromecss
Chetan Shenoy
Chetan Shenoy

Reputation: 843

Issue in Webkit browsers with text-shadow in custom fonts

Webkit browsers (Safari and Chrome) keep cutting off text-shadow on my custom fonts (from TypeKit). I'm not sure what I can do to fix it. I've been looking around but havent found a similar issue anywhere else.

Screenshot in Google Chrome
Screenshot in Chrome

Looks fine in Firefox
Screenshot in Firefox (normal)

Any suggestions would be awesome. Thanks!

Upvotes: 3

Views: 722

Answers (2)

Shahid
Shahid

Reputation: 666

on line 286 of your style.css file change text-shadow property's value to 5px 5px 1px #B2CA52

Upvotes: 0

sg3s
sg3s

Reputation: 9567

This is a problem because webkit makes the text node box too small to accomedate the font. Probably due to its cursive style etc.

Add a   to the end of the text and you will see it works. To offset the extra space that creates you could use a negative right margin. If the only problem is the headers this should work fine... 

margin-right: -4px;

Fiddle arround with the value until you get it right

Upvotes: 3

Related Questions