Подтвердить что ты не робот

Проблема с буквенным обозначением IE9

У меня есть страница, которая отображает ok, в FF (3x, 4x), Chrome, IE (6, 7, 8).

При тестировании на IE9 тексты шире. Исследуя проблему, кажется, что текст фактически визуализируется с более пространственными буквами, чем у других борцов.

При изменении расстояния между буквами до -0.6px тексты были отображены в порядке, аналогично другим браузерам. Также при изменении режима рендеринга на "Вид совместимости" страница выглядит просто отлично.

Знаете ли вы, что вызвало изменение режима рендеринга?

Я "решил" проблему, используя условный комментарий, но я не очень этому рад

<!--[if IE 9]>
<style>
    * {letter-spacing: -0.6px;}
</style>
<![endif]-->

Существуют ли какие-либо другие методы для решения проблемы?

Изменить

Я сделал несколько скриншотов на разных машинах и разных браузерах, и результат можно увидеть здесь

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">
    body {margin:0;padding:0;}
</style>
</head>
<body>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc semper.
</body>
</html>
4b9b3361

Ответ 1

Возможно, это связано с округлением вверх/вниз. Использование десятых долей пикселя - это странная вещь, потому что вы не можете получить меньше, чем целый пиксель на экране, если не знаете, как будет округлено. Вы не можете полагаться на IE, чтобы все было в порядке.

Ответ 2

Попробуйте это, как это работает с Internet Explorer 8 и Firefox:

letter-spacing:0.49px;
letter-spacing:0.88px !ie;

MSIE заполняет первое расстояние между буквами до 0px и игнорирует второе правило. Firefox будет читать второе правило и использовать его вместо первого правила.

Затем, чтобы скомпенсировать, вы можете использовать один и тот же трюк и добавить более горизонтальное дополнение к вашему тексту в MSIE, что вы даете в Firefox.

Конечно, проводите дополнительные тесты с другими браузерами!

Ответ 3

Еще одна вещь, которую стоит рассмотреть сейчас, когда прошло семь месяцев с тех пор, как вы задали этот вопрос, заключается в том, что начиная с июня 2011 года версия 5 FireFox начала быстрое расписание релизов. Они теперь до версии 8 и в качестве быстрого теста, я вижу, что версии 7 и 8 FireFox обе делают текст почти идеальным для пикселя с IE9. Хром кажется "скрюченным" по сравнению с тем, что кернинг намного плотнее, а рендеринг четкого типа в Chrome (на мой взгляд) более суровый, чем IE9 и FF7/8.

Вам не гарантируется кросс-браузерное сопоставление шрифтов, не говоря уже о кросс-платформенном. Во всех браузерах я смотрел по умолчанию (в Windows) Times New Roman, 16pt текст для "нормального" отображения. Если вашему приложению требуется рендеринг текста до уровня соответствия для всех пользователей, все браузеры, все платформы, а затем отображать его как изображение и кэшировать его.

Ответ 4

Попробуйте установить letter-spacing значение для всего документа, поэтому оно будет отображаться одинаково в IE и FF.

Ответ 5

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

В другом потоке я увидел, что это может быть связано с font-face. К сожалению, я еще не нашел решение, но как только найду его, я отправлю его здесь. Может не помочь вам в это время, но это может помочь людям, которые позже обращаются к этому вопросу.

Ответ 6

humeniuc

Вы уверены, что используете шрифт шрифта по умолчанию или используете некоторые другие? Это может вызвать probl

Ответ 7

Вы можете ссылаться на статью Microsoft. может быть проблемой, потому что Text Rendering

Ответ 8

Я всегда обнаружил, что самый полезный способ установить размер шрифта в браузерах - это использовать значения em not px.

Я пытаюсь настроить базовую точку в теге body в CSS:

font-size: 62.5%

Затем, когда я хочу установить размер шрифта, я использую значение em, например:

font-size: 1.1em;

Это соответствует 11px. Преимущество, которое я обнаружил, заключается в том, что он обеспечивает более последовательное взаимодействие между браузерами и улучшает его размер с помощью элементов управления размером браузера.

Попробуйте попробовать - я думаю, он должен решить вашу проблему.

Спасибо nathj07

Ответ 9

Боюсь, что у меня нет IE9 на этой машине - попробуем снова посмотреть завтра на ПК, который делает, но я сразу подумал, что валидатор w3c говорит, что ваш HTML недопустим.

Не нравится, что ваш текст находится прямо в BODY и не находится в каком-либо другом контейнере. Я просто подумал, что это проблема? Возможно, другие браузеры "исправляют" от вашего имени и принимают контейнер абзаца.

Изменяется ли внешний вид, если вы помещаете текст внутри абзаца или DIV?