Хромированный цвет шрифта 'clipping'

Question

У меня есть ссылки, меняющие цвет при наведении курсора, но полный текст не меняется и оставляет обрезанные биты цвета по умолчанию, заставляя его выглядеть багги.

Есть ли способ решить эту проблему?

http://jsfiddle.net/C8K8z/

a{ 
    font-family:'Oleo Script'; 
    font-size:50px; 
    color:white; 
    text-decoration: none; 

} 
a:hover{ 
    color:#c41313; 
    text-decoration:underline; 
} 

Answer 1

Проблема, кажется, со шрифтом Oleo Script. Это не соответствует 100%, но некоторые шрифты шрифта (намеки?) Могут привести к тому, что края будут закрыты за пределами поля элемента.

Я бы порекомендовал использовать другой шрифт, который не имеет этой проблемы, но если вы привержены Oleo, вы можете добавить отступы влево и вправо, чтобы обойти его.

a{ 
    font-family:'Oleo Script'; 
    font-size:50px; 
    color:white; 
    text-decoration: none; 
    padding: 0px 3px 0px 3px; 
} 

Кроме того, ваша скрипка не импортировать шрифт корректно (проблема с jsfiddle я считаю), но я был в состоянии получить его на работу с помощью опции импорта Google Font JavaScript вместо ссылки на CSS ресурс ,

Вы можете увидеть проблему шрифта здесь: http://jsfiddle.net/aYxEU/

И исправление здесь: http://jsfiddle.net/hFgaw/