CSS псевдоэлемент ▼ становится бредом в IE - PullRequest
Новая
       14

CSS псевдоэлемент ▼ становится бредом в IE

8 голосов
/ 18 марта 2012

Я использую символ ▼ в качестве содержимого моего псевдоэлемента: 

a:after {
    content: '▼';
}

Это прекрасно работает во всех современных браузерах (читай: не в IE):

Here you see that it's working correctly in modern browsers

но в IE (9) я просто получаю вместо этого тарабарщину:

Here you see that it's broken in IE(9)

Я думаю, это как-то связано с кодировкой символов,но я не знаю с чего начать.

Ответы [ 3 ]

6 голосов
/ 18 марта 2012

Убедитесь, что и ваша страница, и ваша таблица стилей закодированы и используются как UTF-8. Большинство редакторов должны быть в состоянии сообщить вам кодировку любого открытого файла.

Вы также можете использовать вместо этого последовательность Unicode \9660, но опять же, вам нужно убедиться, что ваши документы закодированы как UTF-8, в противном случае он также может работать некорректно: 

a:after {
    content: '\9660';
}

Или, если ваша таблица стилей имеет правило @charset, она должна указывать на UTF-8: 

@charset "UTF-8";

Обратите внимание, что правила @charset должны появляться в самом начале таблицы стилей ; в @import ed файлах я считаю, что это не должно быть проблемой, но, поскольку Sass фактически объединяет файлы, которые связаны правилами @import во время компиляции, это приведет к ошибкам. Для Sass / SCSS вам нужно поместить правило @charset в начале вашей основной таблицы стилей.

0 голосов
/ 18 марта 2012

Вы также можете попробовать добавить фоновое изображение в ваше меню. 

 a{background:url("http://pathtoyourimage/");}
0 голосов
/ 18 марта 2012

В дополнение к ответу @ BoltClock, обязательно отправьте соответствующие заголовки с вашего сервера и, возможно, просто для правильной меры, добавьте <meta charset="utf-8" /> в тег <head>.

...