Основная разница в рендеринге текста в Chrome и Firefox

Question

У меня есть некоторые существенные различия в рендеринге текста между Chrome и Firefox. Chrome, кажется, применяет некоторые правила сглаживания к тексту и сокращает его немного.

Я пытался поиграть с -webkit-font-smoothing, межсимвольным и межсловным интервалом, но, похоже, ни один из них не дал никакого эффекта.

Смотрите скриншоты

Соответствующий CSS (вычислено):

color: #C4C4C4;
font-family: sans-serif;
font-size: 9px;
font-style: normal;
font-variant: normal;
font-weight: normal;

Соответствующий CSS (вычислено):

font-family:    sans-serif;
font-size:  9px;
font-weight:    400;
font-style: normal;
font-size-adjust:   none
color:  #C4C4C4;
text-transform: none;
text-decoration:    none;
letter-spacing: normal;
word-spacing:   0;
line-height:    11.0833px;
text-align: start;
vertical-align: baseline;
direction:  ltr;

Обратите внимание, что блеклый текст на заднем плане - это просто изображение ... игнорируйте это.

У меня такое чувство, что в Chrome есть css-переключатель для правил сглаживания, но я не уверен, где искать дополнительную информацию.

Edit:

jsfiddle: http://jsfiddle.net/mHzhQ/

Для справки, я нахожусь на Ubuntu. Возможно, это оказывает влияние ..

Любые советы?

Answer 1

Разные браузеры используют разные механизмы рендеринга, которые (должны) давать разные результаты.Это особенно касается небольших размеров шрифта.Там, как правило, не так много вы можете с этим поделать.Если разработчики браузера не предполагают разницы, вполне возможно, что этот излом был разработан на других ОС, но не на вашей (Ubuntu).«минимальный размер шрифта» в Chrome - «Настройки»> «Под капотом»> «Настройка шрифтов» - и Firefox - «Настройки»> «Содержимое»)

Answer 2

«без засечек» может привести к другому шрифту

так что если вы:

семейство шрифтов: вердана, без засечек;

вы увидите почти идеальный результат в обоих браузерах

НТН