CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3font-awesome
Alex
Alex

Reputation: 357

Why is Font-Awesome not working

I'm linking font-awesome in my html file like this: <head><link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"></head>

The icons are not showing up when I'm working locally on my website. But they are showing up on the server!

  1. I thought it could be the extension Ad Plus which is blocking it, but it's not because even if I test it on a browser that doesn't have this extension, it also doesn't work. Moreover, it works fine on the server with Ad Plus.

  2. Then I thought it could be XAMPP and I might not have my Apache server on. But everything is running fine!

  3. I also checked the link inside the <head> and changed it to previous versions, but that didn't make any difference (still not working locally).

  4. I've read everything I could find on SO and google about this problem, but am lost to as why it's not working locally.

I've even made a fiddle to double check wether it works correct online and it does: http://fiddle.jshell.net/g1qor20y/ In the fiddle I copied everything from my <head> since I thought the problem could be found there, but it works fine online.

Why is it not working locally? It's not showing up.

Upvotes: 1

Views: 992

Answers (2)

Mooseman
Mooseman

Reputation: 18891

Your resource doesn't specify a protocol. Protocol-less links break on file://.

Specify http://... when working locally. If you never use https://, feel free to always use http:// in your resource links.

Further reading: https://stackoverflow.com/a/4832046/1234256

Upvotes: 2

Jeroen Flamman
Jeroen Flamman

Reputation: 965

using // is great when you want code to work both with http:// as well as https:// - but locally, the browser will then look for file://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css - assuming it is on your machine..

Upvotes: 2

Related Questions