CSS not being applied from external stylesheet

Issue

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.

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"/>

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

Solution

Change your type property to be text/css not stylesheet/css which is being interpreted as an invaild type and not allowing the CSS to load.

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

Answered By - Marcus Parsons