Как исправить разное отображение шрифта в разных браузерах?

Question

[Егор Бадулин]

Одни и те же шрифты firefox отображает иначе, чем другие браузеры (первый скриншот сделан в Chrome,второй в Firefox). В чем может быть проблема и как это исправить? Также был бы благодарен ссылки на хороший материал по этой теме.

@font-face {
font-family: 'OpenSansBold';
src: url('../fonts/OpenSansBold/opensans-bold-webfont.eot');
src: url('../fonts/OpenSansBold/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/OpenSansBold/opensans-bold-webfont.woff') format('woff'),
url('../fonts/OpenSansBold/opensans-bold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

Comments

[Lynn «Кофеман»]

Я подозреваю, что в каком-то из браузеров у вас ещё и масштаб не 100%.

[Егор Бадулин]

Алексей Тен: с масштабом все в порядке. Снизу человек объяснил причину.

Answer 1

[Вадим Круглов]

Попробуйте воспользоваться библиотекой на CSS - Normalize.css

Интересно почитать:
Всё о CSS шрифтах
Единицы измерения

Answer 2

[el_lei]

еще хорошо бы проверить правильно ли прописано утверждение в правиле CSS, если вы указываете несколько шрифтов.
font-family: 'OpenSansBold', sans-serif.

я постоянно пропускают запятую, почему-то в DevTools и Firefox при этом правило отображается как рабочее и что интересно шрифт, который как бы используется, тот который прописан, но на самом деле, если нет запятой, то правило не работает. и браузер грузит шрифт совсем другой, по предпочтениям. только во вкладка вычленное: в devtools можно заметить.