Font is loading but not showing on Firefox

Asked Dec 12 '19 at 02:51

Active Dec 12 '19 at 02:51

Viewed 38 times

I have this code to provide a new font-face (I'm using symfony)

@font-face {
    font-family: "keplericon";
    src: url("{{ asset('fonts/keplericon/keplericon.eot')|raw }}") format("embedded-opentype"),
        url("{{ asset('fonts/keplericon/keplericon.woff2')|raw }}") format("woff2"),
        url("{{ asset('fonts/keplericon/keplericon.woff')|raw }}") format("woff"),
        url("{{ asset('fonts/keplericon/keplericon.svg')|raw }}") format("svg");
}

And in the css, I have

.icon { font-family: keplericon }

In Chrome, this works like a charm. But it's not working in Firefox. I have verified that the font is downloaded by going to Network -> filter by Font and see my file downloaded (which is the woff2 file)

But nothing show up. Checking the HTML inspection, this shows up

Any help would be appreciated :D. Thanks!

asked Dec 12 '19 at 02:51

Tree Nguyen

1,198
1
14
37

1

@ShirishMaharjan go to the same question? – threeFatCat Dec 12 '19 at 05:01
goto:- https://stackoverflow.com/questions/2856502/css-font-face-not-working-with-firefox-but-working-with-chrome-and-ie?rq=1 – Shirish Maharjan Dec 12 '19 at 05:13
@ShirishMaharjan as I have mentioned in my post, I have confirmed that ff actually downloaded my font. So none of the answers in that post can help me out. – Tree Nguyen Dec 12 '19 at 05:17

Font is loading but not showing on Firefox

0 Answers0