Having some problems with glyphicons from bootstrap 3.3.5 in Firefox

Question

I can't manage to find an answer at my problem. Glyphicons still don't work in Firefox. Firefox only.

What I do for example : <li class="active"><a href="#"><span class="glyphicon glyphicon-search"></span> Home</a></li>

In my .css file :

@font-face {
  font-family: 'Glyphicons Halflings';

src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

I've never had any problems with glyphicons in Firefox. Why not download the file and store it in your folder instead of using src ? github.com/twbs/bootstrap/archive/v3.0.0.zip — kjehfiuh
I'm not an expert but I don't think it's the common way to use them? Beside, the problem only happens with firefox. Why? — Alpha16
It is strange, I have just tried your code in my Firefox and it works. Have you tried in jsfiddle to see if it works? jsfiddle.net/ztm1cbpw — kjehfiuh
Are you sure you have the required CDN's? I have just added the the required css and js files to the jsfiddle you posted and it works. i.e. https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css and https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js jsfiddle.net/d7na1qb8/1 — kjehfiuh

kjehfiuh kjehfiuh · Accepted Answer · 2015-09-07T15:09:38

Based on the jsfiddle you posted for the problem, it appears you are missing the required CDN. After I included these:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script

It displayed the glyphicons. Make sure you have these included in your page and it should work. :)

Having some problems with glyphicons from bootstrap 3.3.5 in Firefox

1 Answers