Bootstrap glyphicons (fonts/****.woff) not loading

1
votes

I am an error getting that looks like this in my Google chrome(56.0.2924.87) console while trying to use bootstrap glyphicons

enter image description here

Even though i have my .woff files and .ttf files located in my "public/css/fonts" folder.

Addtional Information

I am using Wampserver with apache(2.4.23)

I installed bootstrap.css with "npm install bootstrap"

This is what my font-face looks like

@font-face {
  font-family: 'Glyphicons Halflings';
  font-style: italic;
  src: url('/public/css/fonts/glyphicons-halflings-regular.eot');
  src: url('/public/css/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/public/css/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('/public/css/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/public/css/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/public/css/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');

}

I try to call the glyphicons like this:

<i class="glyphicon glyphicon-chevron-left"></i>

Does anyone have any idea where this problem might be located?

1
node.jstwitter-bootstrapapachegoogle-chromewoff
"Invalid version tag", can you show your html/css? (Where you call the font and call bootstrap) – Thomas Rbt
@Thomas Rbt edited with further information – Marcus H
@Thomas Rbt bootstrap is working fine, aside from the glyphicons – Marcus H

1 Answers

2
votes

Double check @font-face location path and also the mime type.