HTML not loading CSS

Question

I\'m trying to load a css file. I\'ve tried:

And:

Answer 1

You do not use ./ , you have to either use ../ when the file is one level down from your original HTML directory or simple use css/style.css no forward slashes. I believe the problem is with your naming conventions, please double check the names of folder and files. If files are on same directory then simply use style.css no forward slashes or directory name.

Answer 2

I want to post my own version of the answer on this very old thread as I just found a possibly known but 'ignored-after-solving' way of getting into this problem of CSS just refusing to link with the HTML. I spent hours on trying to solve the problem and in the end, it turned out to be a very trivial thing. Do not want others to go through the same ordeal. So here we go:

Since I was new to HTML/CSS I tried to copy some sample code snippets from the internet. While doing so I linked my CSS file as follows:

<link rel=¨stylesheet¨ type=¨text/css¨ href=¨chat.css¨>

While at first glance the code looks perfectly fine, on viewing carefully (which unfortunately I did after hours of googling around) it turns out that the quotation marks I had used (copied from internet code) were not really quotation marks but some other characters. I found this because they looked smaller when compared to other quotation marks typed in my code elsewhere and which looked more like: ""

On realizing this I changed the quotations in the CSS link:

<link rel="stylesheet" type="text/css" href="chat.css">

and lo-behold everything started working beautifully (thanks CSS).

Lesson learned - Beware of copy/paste from the internet.

I wish I had been more diligent earlier.

Hope this helps some searching soul in future!!

Answer 3

The error is a page not found error, which indicates the web server can't find the file it was told to look for at "/css/style.css". The leading / with no dots indicates the root level of the website.

If you can load the web page which includes the css file, the path will be relative to the web page. "./style.css" and "style.css" both point to file style.css the same directory as the webpage; "../style.css" points one directory up. "../css/style.css" points one directory up, then down through the css directory.

If the path seems right, double-check the case of the directory and filenames - if your server is case-sensitive, it will treat files called Style.css and style.css as different files.

Can you browse directly to the file at /css/style.css on your website?

Unlikely, but it can be worth checking that the files have read permissions for the webserver's user.

Is it possible that your browser, or an intervening proxy is caching the file? Try a hard refresh if you web browser has one, or clearing your cache.