Юникод вниз треугольник не отображается в IE9

Я хотел бы включить треугольник вниз в моем раскрывающемся меню CSS. Он работает правильно в каждом браузере, за исключением IE9.Юникод вниз треугольник не отображается в IE9

В обычных браузеров (Firefox, Opera, Chrome и т.д.) это выглядит следующим образом:
normal

Однако в IE9 это проявляется так:
ie9

The код CSS:

.parent-down > em:after, 
.parent-down > a > em:after { 
    content: "\25be"; 
}

Любая идея, в чем проблема и как я могу ее исправить?

источник

2013-11-18 Anonymous

У вас есть кодировка? * * –

У вас есть "@charset" UTF-8 ";" внутри ваших таблиц стилей? Я предполагаю, что это значок шрифта от какого-то поставщика, в большинстве случаев эти поставщики предлагают исправления шрифтов для IE, например. icomoon использует формат src: url ('fonts/icomoon.eot? #iefix') ('embedded-opentype'), проверьте: http: // gomakethings.com/icon-fonts/ – darcher

Я использую HTML5 и имею в начале. –

Вы должны объявить семейство шрифтов для элемента (псевдо-), содержащий специальный символ, так что вы используете только fonts that are known to contain that character. Например, добавьте следующее правило в вашем объявлении:

font-family: Arial Unicode MS, Lucida Sans Unicode, sans-serif;

Когда вы объявляете Helvetica, как вы говорите (в комментарии) вы делаете, Windows рассматривает его как Arial своими собственными специальными внутренними правилами (если Helvetica не доступно, и обычно это не так). Поскольку Arial не содержит символа, браузер должен проверить различные шрифты в системе в определенном порядке, заданные его настройками, чтобы найти тот, который содержит символ. Браузеры могут потерпеть неудачу при этом, и IE часто это делает.

В этом случае, вероятно, лучше использовать другой, более заметный символ, который, как оказалось, имеет лучшее покрытие шрифтов. Основной принцип заключается в том, что специальные символы требуют особого внимания при объявлении шрифтов. Об общих соображениях об этом см. Мой Guide to using special characters in HTML.

источник

2013-11-18 22:15:58

Я включил «Arial Unicode MS» в объявление шрифта элемента body 'body {font-family: Helvetica, Arial, Arial Unicode MS, sans-serif;}', и он отлично работает, спасибо за это предложение. –

@Artemyss, обратите внимание, что Arial Unicode MS не так универсально установлена как Arial. Он поставляется с Microsoft Office и обычно отсутствует на компьютерах, на которых не установлен Office. Вот почему я включил [Lucida Sans Unicode] (http://www.microsoft.com/typography/fonts/font.aspx?FMID=1263) - он доступен даже на самых старых системах Windows, которые вы можете найти. –

Хорошо, я тоже включу его, спасибо за предупреждение. –

В IE9 есть ошибка, которая заставляет шрифт контейнера быть установленным шрифтом первого элемента этого контейнера. Попробуйте установить селектор :before так:

.parent-down >em:before, 
.parent-down> a > em:before { 
    content: ''; 
}

Это заставит IE9 признать, что шрифт назначен на контейнер шрифт предназначен для использования

См this site, которая описывает подобную проблему и дает этот обходной путь, который решил эту очень сложную проблему для меня.

источник

2013-11-18 18:58:05 Robusto

Спасибо, но, к сожалению, это не работает для меня. Я не использую Font Awesome или любые специальные шрифты, а только Helvetica. –

Я пришел к решению случайно.

Однако IE9 не показывает "\25be" (▾) характер, она показывает "\25bc" (▼).

Это тот же треугольник, однако несколько больше. Итак, теперь я использую этот вариант и изменяю его размер с помощью CSS, поэтому он выглядит идентично исходной версии. Не спрашивайте, почему, IE9 довольно странно.

Мой новый код:

.parent-down > em:after, 
.parent-down > a > em:after { 
    content: "\25bc"; 
    font-size: 8px; 
    vertical-align: 2px; 
    margin-left: 2px; 
}

источник

2013-11-18 19:40:55

Объяснение: U + 25BE не входит в шрифт Arial, но U + 25BC. –

Юникод вниз треугольник не отображается в IE9

ответ

Смежные вопросы