Проблема подгрузки шрифтов по абсолютным ссылкам у Firefox и IE

[Torawhite]

Здравствуйте!

Проблема следующая: изначально все ссылки в CSS на шрифты указывал относительные - все браузеры отлично подгружали как с хостинга, так и с Denwer, но сейчас все ссылки изменил на абсолютные и теперь шрифты отказывается погружать Firefox, IE! Chrome, Opera и Yandex-браузер работают корректно и всё подгружают! В чём может быть проблема?

[Kublyakov]

Вчера столкнулся с проблемой - Firefox не подхватывал иконочный шрифт по абсолютной ссылке, заменил на относительные и всё стало норм. Не вижу проблем в использовании относительных ссылок, если не работают абсолютные. Или я ошибаюсь?

[Torawhite]

Вчера столкнулся с проблемой - Firefox не подхватывал иконочный шрифт по абсолютной ссылке, заменил на относительные и всё стало норм. Не вижу проблем в использовании относительных ссылок, если не работают абсолютные. Или я ошибаюсь?

Дело в том, что эти шрифты у меня включены в php-блоки, если прописать там относительные ссылки, то блоки работать не будут на других страницах.

[Great Rash]

Не верю, что шрифт не подключается по абсолютному пути. Покажите как подключаете.

[Torawhite]

Не верю, что шрифт не подключается по абсолютному пути. Покажите как подключаете.

@font-face {

    font-family: 'avante';

    src: url('http://torawhite.ru/fonts/avante.eot#') format('embedded-opentype'),

          url('http://torawhite.ru/fonts/avante.ttf') format('truetype'),

          url('http://torawhite.ru/fonts/avante.svg#avante') format('svg'),

          url('http://torawhite.ru/fonts/avante.woff') format('woff');

    }

@font-face {

    font-family: 'helvetica';

    src: url('http://torawhite.ru/fonts/helvetica.eot#') format('embedded-opentype'),

          url('http://torawhite.ru/fonts/helvetica.ttf') format('truetype'),

          url('http://torawhite.ru/fonts/helvetica.svg#helvetica') format('svg'),

          url('http://torawhite.ru/fonts/helvetica.woff') format('woff');

    }

 

Синтаксис немного поправил - у Firefox подключился, а IE так и не желает!

 

Не верю, что шрифт не подключается по абсолютному пути. Покажите как подключаете.

Разобрался, вроде! С таким ситаксисом подключает даже у IE:

 

@font-face {

    font-family: 'avante';

    src: url('http://torawhite.ru/fonts/avante.eot#'),

         url('http://torawhite.ru/fonts/avante.ttf') format('truetype'),

         url('http://torawhite.ru/fonts/avante.svg#avante') format('svg'),

         url('http://torawhite.ru/fonts/avante.woff') format('woff');

    }

@font-face {

    font-family: 'helvetica';

    src: url('http://torawhite.ru/fonts/helvetica.eot#'),

         url('http://torawhite.ru/fonts/helvetica.ttf') format('truetype'),

         url('http://torawhite.ru/fonts/helvetica.svg#helvetica') format('svg'),

         url('http://torawhite.ru/fonts/helvetica.woff') format('woff');

    }

 

А изначально был такой вариант:

 

@font-face {

    font-family: 'avante';

    src: url('http://www.torawhite.ru/fonts/avante.eot');

    }

    

@font-face {

    font-family: 'avante';

    src: url('http://www.torawhite.ru/fonts/avante.ttf') format('truetype'),

         url('http://www.torawhite.ru/fonts/avante.svg#avante') format('svg');

    }

    

@font-face {

    font-family: 'helvetica';

    src: url('http://www.torawhite.ru/fonts/helvetica.eot');

    }

    

@font-face {

    font-family: 'helvetica';

    src: url('http://www.torawhite.ru/fonts/helvetica.ttf') format('truetype'),

         url('http://www.torawhite.ru/fonts/helvetica.svg#helvetica') format('svg');

    }

[Great Rash]

Попробуйте синтаксис отсюда (первый блок кода).

[Torawhite]

Попробуйте синтаксис отсюда (первый блок кода).

Спасибо!

[Torawhite]

Попробуйте синтаксис отсюда (первый блок кода).

Всё же проблема осталась! Как-то через раз подключает, очень капризные оказались Firefox и IE. Прописал так:

 

@font-face {

    font-family: 'avante';

    src: url('http://torawhite.ru/fonts/avante.eot');

    src: url('http://torawhite.ru/fonts/avante.eot?#iefix') format('embedded-opentype'),

         url('http://torawhite.ru/fonts/avante.ttf') format('truetype'),

         url('http://torawhite.ru/fonts/avante.svg#avante') format('svg'),

         url('http://torawhite.ru/fonts/avante.woff') format('woff');

    }

@font-face {

    font-family: 'helvetica';

    src: url('http://torawhite.ru/fonts/helvetica.eot');

    src: url('http://torawhite.ru/fonts/helvetica.eot?#iefix') format('embedded-opentype'),

         url('http://torawhite.ru/fonts/helvetica.ttf') format('truetype'),

         url('http://torawhite.ru/fonts/helvetica.svg#helvetica') format('svg'),

         url('http://torawhite.ru/fonts/helvetica.woff') format('woff');

    }

 

[Great Rash]

Обратите внимание на порядок подключения разных форматов, он имеет значение.

[Torawhite]

Обратите внимание на порядок подключения разных форматов, он имеет значение.

Прописал порядок так, как в статье, ссылку на которую Вы кинули, всё осталось по-прежнему

[Torawhite]

Ребят! Неужели никто не сталкивался с подобной проблемой?

[Great Rash]

http://torawhite.ru/ и http://www.torawhite.ru/ - разные домены. Вы или везде уберите www или везде проставьте, и всё станет ок.

[Torawhite]

http://torawhite.ru/ и http://www.torawhite.ru/ - разные домены. Вы или везде уберите www или везде проставьте, и всё станет ок.

Всё везде изменил на http://www.torawhite.ru/ . Стали подключаться, но не подключаются в разделе, который висит на домене третьего уровня (закладка "Маркет") http://www.store.torawhite.ru/ хотя абсолютные ссылки все одни и те же, папка со шрифтами одна и файл css, который их подключает тоже один.

[Great Rash]

Походу у FireFox проблемы с подключением шрифтов на кроссдоменных сайтах. Вот я тут нагуглил решение этой проблемы (понадобится изменить .htaccess, уж не знаю есть у вас доступ к серверу).

 

Ну или погуглите по запросу "cross domain css fonts".

[Torawhite]

Походу у FireFox проблемы с подключением шрифтов на кроссдоменных сайтах. Вот я тут нагуглил решение этой проблемы (понадобится изменить .htaccess, уж не знаю есть у вас доступ к серверу).

 

Ну или погуглите по запросу "cross domain css fonts".

У IE такие же проблемы. Написано, что нужно поместить текст в файл с расширением *.htaccess в такую же папку, как папка, в которой лежат мои шрифты. То есть на сервере должен создаваться дубликат с моей папкой или сам файл должен создаваться в моей папке, в которой помещены шрифты?

Аллилуйя! Наконец-то проблема решилась! Просто создал файл с названием ".htaccess" без указания расширения, поместил туда искомый текст, а сам файл залил через ftp-клиент  в папку со шрифтами на сервер! IE тоже стал всё подгружать! Спасибо вам огромное за помощь!

Edited June 5, 2014 by Torawhite