1

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.

Alex
  • 357
  • 1
  • 12

2 Answers2

2

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

Community
  • 1
  • 1
Mooseman
  • 18,763
  • 14
  • 70
  • 93
  • Thank you very much! It worked out great :) It's one of those things I won't be forgetting soon. – Alex Feb 11 '15 at 21:24
2

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..

Jeroen Flamman
  • 965
  • 6
  • 10