Firefox кернинг отличается от других браузеров (отрицательный межбуквенный интервал в CSS) - PullRequest
3 голосов
/ 08 июля 2010

У меня проблемы с рендерингом текста в Firefox по-разному в любом другом браузере, когда применяется отрицательный интервал между буквами:

h2{font-size:1.6em;font-weight:bold;color:#999;letter-spacing:-0.10em;}

<h2>Time</h2>(approx)

Вот текст, отображаемый в большинстве браузеров: http://img707.imageshack.us/i/font2x.png/

Вот текст, отображаемый в Firefox: http://img444.imageshack.us/i/font1.png/

Редактировать: Это прямые скриншоты, изображения имеют одинаковое разрешение.

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

Ответы [ 3 ]

1 голос
/ 07 августа 2012

Я не знаю почему, но если вы используете pt вместо em в вашей font-size декларации (но оставьте em для letter-spacing, Firefox должен отображать ваш текст, как это делают другие браузеры.

h2{font-size:18pt;font-weight:bold;color:#999;letter-spacing:-0.10em;}
0 голосов
/ 21 апреля 2013

Я исправил это путем сброса css. Просто добавьте приведенную ниже ссылку на вашу HTML-голову.

<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/reset/reset-min.css">

Более подробную информацию можно найти здесь. http://developer.yahoo.com/yui/reset/

0 голосов
/ 08 июля 2010

Добавьте объявление width: 100%; к правилу h2 для запуска макета в «других» браузерах.

...