CODEWITHSUNDEEP
csscdnfont-awesome
Evorlor
Evorlor

Reputation: 7561

Why does CDN work, but a relative link does not?

I just asked this question: Why is Font Awesome only showing a square?.

The gist of it is that my font-awesome.min.css file was not working. I was getting 404 errors when trying to load icons from it. Someone gave the ridiculous suggestion of changing:

<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

to

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

I tried their suggestion with confidence that it would not change anything, but it worked!

The code in MyProject/font-awesome/css/font-awesome.min.css (the filepath is correct) is identical to the code at //maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css.

Why is it that the CDN works, but my local copy gives me 404 errors?

Some clarification:

The file is being found when I try to link to the relative file (not using the CDN). The images within the CSS come up with 404. But with identical code at the CDN, there is no 404 for the images. I get the following error for each respective image:

Failed to load resource: the server responded with a status of 404 (Not Found)  http://localhost:63343/MyProject/font-awesome/fonts/fontawesome-webfont.woff2?v=4.3.0

Upvotes: 0

Views: 2213

Answers (2)

Barmar
Barmar

Reputation: 781098

The CSS file refers to font files using relative URLs. So when you copy the CSS, you also have to copy the font folder to MyProject/font-awesome/fonts.

Basically, when you download the Font Awesome ZIP file, you should extract the entire thing into MyProject/font-awesome. This will get you the all the files and they'll be in the proper location.

Upvotes: 2

xoail
xoail

Reputation: 3064

You are pointing to the absolute url. Try changing it to relative to Home page. Ex: /font-awesome/css/font-awesome.min.css.

Upvotes: -1

Related Questions