CODEWITHSUNDEEP
font-awesome
user3199336
user3199336

Reputation: 21

Font Awesome Icons not showing up

I'm trying to use some Font Awesome Icons in my nav. Just some simple down arrows next to each list item. If I hotlink to the Font Awesome CDN, it works fine, Whenever I try to copy the files locally and upload them to my server, I just get the square boxes. I'm pretty sure all my paths are correct, just can't figure out where I'm going wrong.

http://builderpreviews22.com/

any help is appreciated.

Upvotes: 1

Views: 10442

Answers (5)

Arctelix
Arctelix

Reputation: 4576

If all your paths are correct make sure your static files server has CORS enabled and sets the Access-Control-Allow-Origin header. Hope that helps somebody!

Upvotes: 0

MrGrigri
MrGrigri

Reputation: 314

If you are using sass or scss, make sure that the path to the font library is relative to the compiled css file and not the _variables.scss file.

Upvotes: 1

James Dayeh
James Dayeh

Reputation: 526

Registering the mime types in your web.config is not enough. Actually the solution is dumb: After registering the mime types in web.config the application will look for .woff and .eot files extensions. The files extension in your case are actually .eot?v=4.0.3. Just rename the files to be .eot and .woff and replace their includes in other css files by removing the version and it will work like charm :D :)

Upvotes: 0

Christian Armamento
Christian Armamento

Reputation: 1

This is also happens to me in my MVC project when deployed to production.

src: url('../fonts/fontawesome-webfont.eot?v=4.0.3');

change it to 

src: url('../../Content/fonts/fontawesome-webfont.eot?v=4.0.3');

Upvotes: 0

fiskolin
fiskolin

Reputation: 1421

A network error 500 in your site:

"NetworkError: 500 Internal Server Error - http://builderpreviews22.com/font-awesome/fonts/fontawesome-webfont.ttf?v=4.0.3"

This happens when the browser tried to load an inexistent content, in this case the fontawesome-webfont.ttf.

You have a property in your CSS that gets the fontawesome-webfont.ttf?=4.0.3 file:

url('../fonts/fontawesome-webfont.woff?v=4.0.3')

Check if you have that file inside your font-awesome folder.

Upvotes: 0

Related Questions