'CSS not being applied from external stylesheet

I have been learning how to make client-server applications recently and am following this tutorial by Traversy Media. This is the Github page for the code that mine is based on. Though I have resolved the MIME type issue that is brought up.

But the problem is, when I run the code, the CSS stylesheets(both the stylesheet linked to the website and the style.css file in the css folder) do not appear to be applied to the HTML page. What happens when I run the HTML file is that the HTML page appears to be without any style, meaning that although the HTML does appear in the webpage, the HTML elements do not have any styles. HTML page that appears

I thought that it was simply because of an error in referencing the CSS files but I have tried to fix it by moving the CSS files around and also changing the hrefs of the link element in the HTML code and also copying the code of the CSS stylesheet from the website into "online-resource.css" but none of what I did worked.

    <link
        rel="stylesheet"
        href="online-resource.css"
        type="stylesheet/css"
    />
    <link rel="stylesheet" href="style.css" type="stylesheet/css"/>

How I moved the files around

Anyone have any ideas? It probably doesn't have anything to do with node.js because the same thing happens when I run it independently

htmlcss


Solution 1:[1]

I think the css file not loading properly. Also check whether the code inside the css files are correct or not. Make sure you saved the file. It's silly, but I can personally vouch for the time when I couldn't make my site update, and I forgot to save/update the file I was viewing. Make sure the stylesheet is loading. In Chrome, if you right-click -> inspect element and go to the sources tab, you can see all loaded resources, including your CSS.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Arun Nayak

Related Questions