2013-11-19 3 views
0

Я занимаюсь разработкой веб-сайта, и я только понял, что существует проблема с рендерингом шрифтов только на Safari, и я не нахожу решение.Интервал букв Css с пользовательским шрифтом на сафари?

В основном я использовал два пользовательских шрифта на своем веб-сайте. У меня есть пробел в письме 0.05em, чтобы уважать мой файл psd.

Мой шрифт хорошо отражается на Chrome, Firefox, Internet explorer. Но для Safari, как ни странно, это не работает, расстояние между буквами не отображается. я где-то читал, что это может быть проблема с WebKit, но если это "тот случай, почему бы он работать на хром? Это действительно делает сайт ужасен на сафари, и мне нужно найти починку.

I не могу поверить, что нет никакой возможности исправить это

Если у вас есть какие-либо идеи было бы с удовольствием

Ниже мой код

Css объявляя шрифт:...

@font-face { 
    font-family: 'univers_lt_std_59_ultracnRg'; 
    src: url('fonts/univers-lt-std-59-ultra-condensed-webfont.eot'); 
    src: url('fonts/univers-lt-std-59-ultra-condensed-webfont.eot?#iefix') format('embedded-opentype'), 
     url('fonts/univers-lt-std-59-ultra-condensed-webfont.woff') format('woff'), 
     url('fonts/univers-lt-std-59-ultra-condensed-webfont.ttf') format('truetype'), 
     url('fonts/univers-lt-std-59-ultra-condensed-webfont.svg#univers_lt_std_59_ultracnRg') format('svg'); 
} 

Css моего пункта:

color: #57585a; 
font-family: 'univers_lt_std_59_ultracnRg'; 
letter-spacing: 0.05em; 
font-size: 19.58px; 
text-transform: uppercase; 
-webkit-font-kerning: initial; 
line-height: 26.47px; 

Rendering на Chrome Firefox и Internet Explorer

enter image description here

Rendering на сафари

enter image description here

Очевидно, что расстояние между буквами делаетне работает.

Если у вас есть идеи, спасибо за это.

ответ

1

Попробуйте использовать пиксели вместо относительных значений для межстрочного интервала. Кроме того, используйте круглые числа для размера шрифта и высоты строки. Сафари, как известно, кругом по-разному.