Почему текст отображается с большим шрифтом в Opera?

Question

Я работаю над HTML-страницей, которая должна быть более или менее идеальной для пикселей, и я заметил, что в Opera 10 шрифты отрисовываются больше, чем в других браузерах, даже если размер шрифта фактическиТо же самое.

Пожалуйста, посмотрите страницу этого примера в Opera 10 и другом браузере, таком как Firefox 3.6:

http://troy.onespot.com/static/stack_overflow/opera_font_size.html

Кроме того, вот скриншот, иллюстрирующий проблему:

http://skitch.com/troywarr/d47m1/font-size

Красные поля за текстом «50px» и «46px» (оба стиля имеют соответствующий размер шрифта) имеют высоту 50px.

В Firefox 3.6 спуск "p" в "50px" совпадает с нижней частью красной рамки позади него.В Опере спуск "p" в "50px" висит ниже;именно «46px» более точно соответствует «50px» в Firefox.Это наводит меня на мысль, что Opera рендерит шрифты в приблизительном размере на 10% больше.

Эта и та же проблема с другим основным текстом полностью отбрасывает мой макет страницы в Opera 10. Пожалуйста, дайте мне знатьесли у вас есть идеи о том, что может быть причиной, или, по крайней мере, как предотвратить / исправить это.

Спасибо!

ОБНОВЛЕНИЕ:

Похоже, у меня не установлена ​​надлежащая копия Helvetica - я удалил ее из стека шрифтов и не увидел разницы в отображаемом тексте в моем тестестраниц.

Я обновил тестовые страницы, чтобы использовать только общее семейство шрифтов "sans-serif", так что, надеюсь, мы все сейчас видим одно и то же.

Интересно, используя общийШрифт «serif» отображается точно так же в Opera и Firefox.

Может ли эта проблема быть просто извращением того, как Opera отображает общий шрифт «sans-serif»?

ОБНОВЛЕНИЕ 2:

Это может быть важно: я использую Mac OS X Snow Leopard.Сейчас я экспериментирую с другими шрифтами, чтобы выяснить, смогу ли я выделить проблему дальше.

ОБНОВЛЕНИЕ 3:

Я создал еще одну тестовую страницу, используя Arial:

http://troy.onespot.com/static/stack_overflow/opera_font_size_reset_arial.html

И теперь Opera и Firefox почти совпадают!

Вероятно, я смогу избежать использования Arial вместо Helvetica в этом проекте.Насколько я знаю, у меня есть полностью стандартная версия Helvetica для OS X - поэтому я не могу позволить себе никакого расхождения между тем, как разные пользователи видят шрифты на моей странице.Я остановлюсь на проверенном и верном Arial.

Что это может означать, хотя - шрифт Sans-Serif по умолчанию в OS X просто странно отображается в Opera или что-то в этом роде?

Answer 1

Я сталкивался с этой темой, когда у меня возникали аналогичные проблемы с Opera 11.10 в Windows 7 x64.

По умолчанию Opera использовала 20px в качестве основного размера шрифта (а не 16px, который используют другие браузеры).Это сохраняется даже после удаления, удаления настроек Opera и повторной установки.Оказывается, Opera выполнит настройку размера шрифта вашей системы (установите в «Панели управления \ Оформление и персонализация \ Отображение» на Win7) для отрисованного текста сайта , тогда как другие браузеры (япроверено FF4, Chrome 11, Safari 5, IE 9) нет.Размер моего системного шрифта был установлен на 125%, что объясняет 20px.Как только я установил системный масштаб шрифта на 100%, Opera вела себя так же, как и другие.

Я не уверен, какое поведение более корректно (в некотором смысле, приятно, что Opera учитывает мой выбор шрифта), нотак как другие браузеры не делают то же самое, это «неожиданно».У меня нет Mac для тестирования, но, возможно, MacOS имеет аналогичные настройки системного шрифта?

Answer 2

У меня была похожая проблема.

Я обнаружил, что вычисляемый размер шрифта по умолчанию в FF и большинстве других браузеров составляет 16px, но в опере по умолчанию кажется 20px.

Я просто установил размер шрифта: 16 пикселей;для html, и он, кажется, позаботился об этом.

Answer 3

Я подозреваю, что Opera использует другой резервный шрифт для Sans-serif, чем другие браузеры.Это должно быть возможно подтвердить или устранить с помощью другого шрифта, который определенно установлен в системе.

Answer 4

Мне кажется, я знаю вашу проблему. Я получаю его абсолютно одинакового размера во всех браузерах (по крайней мере, Firefox, Opera и Chrome). Это, я уверен, может быть легко пропущено, если вы не знаете, что вы или кто-то другой сделал это, но попробуйте проверить настройки масштабирования в Opera ... дайте мне знать, если это не поможет, и я над этим еще поработаю.

Answer 5

Я не воспроизводю вашу проблему. Вот что я получаю в Firefox 3.6.8 (и в Internet Explorer 8):

Answer 6

Столкнулся с похожими проблемами, пришлось изменить мой запасной порядок с:

font-family: Helvetica, Verdana, Arial, sans-serif;

на

font-family: Helvetica, Arial, sans-serif;

Поскольку Arial и Helvetica почти точно одного размера, когда опера возвращается назадэто все еще выглядит хорошо.

Answer 7

У меня была похожая проблема, пока я не использовал reset CSS Эрика Мейера :)

Answer 8

Здесь таблица стилей сброса css действительно может упростить для вас вещи.

http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/