Ikony Fontello nie działają

Witam, piszę z problemem, z którym nie poradziłem sobie też kiedyś w innym projekcie i po dziś dzień nie mogę znaleźć przyczyny, Chodzi o Fontello, co ciekawe kiedyś używałem go i wszystko było OK. Porównuję udane ich użycie z obecnym i nie widzę różnic. Myślę, że nie jest to temat, który należy jakoś bardzo rozpisywać, przedstawię więc właściwe fragmenty kodu.

Pliki:
Pobrane pliki, dla pewności testowania wszystkie CSS, wsadziłem do swojego katalogu CSS.

Załączenie pliku:

<link rel="stylesheet" href="<?php echo ROOT_URL; ?>assets/css/mainStyle.css">
**<link rel="stylesheet" href="<?php echo ROOT_URL; ?>assets/css/fontello.css">**

Użycie ikony:

<i class="icon-headphones"></i>

Zamiast ikony wyświetla się kwadrat. Jakieś sugestie?

Czy fonty wczytują się poprawnie?

Możesz sprecyzować? Każdy font, którego chcę użyć zastąpiony jest kwadratem.

Patryk27 napisał(a):

Czy fonty wczytują się poprawnie?

Z Fontello powinieneś mieć pliki CSS (tj, style) oraz TTF/WOFF/WOFF2 (tj. fonty) - czy fonty wczytują się poprawnie / w ogóle?

Chodzi mi raczej o to, co rozumiesz poprzez "wczytanie". Jeśli masz na myśli po prostu otwarcie tych plików to widzę same 'chińskie' znaczki.

Patryk27 napisał(a):

Z Fontello powinieneś mieć pliki CSS (tj, style) oraz TTF/WOFF/WOFF2 (tj. fonty) - czy fonty wczytują się poprawnie / w ogóle?

Otwórz zakładkę Network i zobacz, czy przeglądarka wczytuje te fonty.

Dobra, dzięki za naprowadzenie :) Wyświetliło na czerwono pliki WOFF, więc wgrałem je do folderu równorzędnego z folderem CSS. I zadziałało :) Dlaczego jednak wszędzie piszą o potrzebie dodania tylko fontello.css? Dodanie plików z katalogu font jest wymagane w konkretnych przypadkach, gdy 'coś nie działa'?

Patryk27 napisał(a):

Otwórz zakładkę Network i zobacz, czy przeglądarka wczytuje te fonty.

Bez fontów ani rusz - czy to w przypadku Font Awesome, Fontello czy większości innych tego typu rozwiązań.

To w fontach są zapisane faktyczne kształty, które przeglądarka musi wyrenderować - CSSy jedynie zawierają instrukcję jak font wczytać i która klasa odpowiada której ikonce, nie zawierają jednak kształtów.