На этой неделе мы наткнулись на довольно странную ошибку в IE7 (удивление, удивление) при встраивании файла шрифта EOT с использованием конструкции @font-face.
Чтобы сэкономить на пропускной способности, мы часто редактируем наборы символов из шрифта, который, как мы знаем, не будет использоваться на сайте. В данном конкретном случае мы использовали этот шрифт для заголовков, которые все были составлены в регистре заголовков, но отображались в верхнем регистре с использованием свойства text-transform. Логически мы сохранили все наши файлы шрифтов только с заглавными буквами, поскольку мы просто не используем строчные буквы.
Сайт отлично отображается в каждом браузере (включая IE6 и IE8), который поддерживает конструкцию @font-face, за исключением заметного IE7. IE7 отображал только первый символ каждого слова в правильном шрифте - остальные символы отображались в шрифте браузера по умолчанию.
Почесывая головы, мы наконец-то выяснили, что, поскольку заголовки фактически были написаны как регистр заголовка (и, следовательно, содержали строчные буквы), хотя свойство text-transform было развернуто, а символы появлялись в верхнем регистре, IE7 требовались строчные буквы существовать в файле EOT для отображения заглавных букв. (Интуитивно понятно, не так ли?)
Простым исправлением было восстановление файла EOT с использованием как символов верхнего, так и нижнего регистра, даже если символы нижнего регистра никогда не использовались.
Как я могу исправить это правильно? (т.е. заставить IE7 отображать символы верхнего регистра без необходимости включать символы шрифта в нижнем регистре).
Спасибо!