Font Face не работает для символов настраиваемого языка

Не уверен, как воспроизвести это в jsFiddle, но я постараюсь объяснить проблему как можно лучше.

Импортируем купленный шрифт в CSS:

@font-face {
    font-family: 'ForoItalicRegular'; 
    src: url('../Fonts/foro_italic/ForoIta-webfont.eot');
    src: url('../Fonts/foro_italic/ForoIta-webfont.eot?#iefix') format('embedded-opentype'),
    url('../Fonts/foro_italic/ForoIta-webfont.woff') format('woff'),
    url('../Fonts/foro_italic/ForoIta-webfont.ttf') format('truetype'),
    url('../Fonts/foro_italic/ForoIta-webfont.svg#Foro-ItalicRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

Затем мы применяем этот шрифт к тегу ввода с атрибутом заполнителя:

.m_hdr_glb_search input { width:230px; margin:0; padding:13px 0px 12px 5px; text-overflow:ellipsis; background:transparent; color:#221b33; font-size:0.750em; font-family:ForoItalicRegular,Georgia,serif; border:none; }

Наш веб-сайт поддерживает французский язык, поэтому проблемный текст появляется, когда символы с французским акцентом вводятся в заполнитель:

<input type="text" placeholder="Quartier, ville ou numéro">

Вот результат:

введите описание изображения здесь

После тщательного изучения и некоторого тестирования я обнаружил, что буква «e» в слове «numero» с акцентом понижается по стеку шрифтов до Georgia.

Единственная причина, о которой я могу думать, это то, что акцентированный символ недоступен в таком размере, но после дополнительных испытаний это просто не так. Я могу изменить размер импортированного шрифта до любого размера в других тегах (например, - div, p, span и т. Д.), И символы с диакритическими знаками не будут ухудшаться до Джорджии.

Это происходит только в атрибуте placeholder входного тега. Я умею воспроизводить во всех основных браузерах.

Это недосмотр с реализацией атрибута placeholder?


person Lowkase    schedule 06.09.2012    source источник


Ответы (1)


Оказывается, генератор Font Squirrel не был настроен должным образом при создании файлов веб-шрифтов.

Для создания глифов правильного языка необходимо выбрать следующие параметры Font Squirrel:

Щелкните переключатель Custom Subsetting и выберите следующие параметры:

Кодировка символов: Mac Roman

Тип символа: установлены все флажки в этом разделе.

Язык: английский, французский, и т. д..

Я заменил свои старые файлы веб-шрифтов вновь созданными веб-шрифтами, и французские символы не появились.

person Lowkase    schedule 13.09.2012
comment
Потрясающие! Я скачал шрифт с сайта Font Squirrel. Текст примера хорошо выглядел на их тест-драйве, однако шрифт не работал локально. Я загрузил его обратно, использовал генератор, и новый файл шрифта работает! Понятия не имею почему, но IDC уже нет. - person Qwerty; 26.09.2016