css files not load express-handlebars

Issue

I’m having trouble with the CSS acess using express-handlebars. I can’t see the problem and I would like to have your help.

In my home.handlebars: <link rel="stylesheet" href= "css/home.css">

In my home.css:

footer{
background-color: blue; }

Instead of showing a blue background as I ask for, it shows nothing:

Footer code:

    <footer>
    <font size = 4>
        <h5>© 2019 Suplementos Atlética</h5>
    </font>
</footer>

In expresss, you have to set express static. It Will looks like this code below:

app.use(express.static('public'));

if your public folder is inside src folder use below method

app.use(express.static("src/public"));

Now, you can create a public folder in your root app and css folder in your public folder and put your style into there.

So, your directory with looks like this:

How to use? You can call your link like this:

<link rel="stylesheet" href= "/css/home.css">

For an example, you can look at my example project here: https://codesandbox.io/s/elegant-fog-1n61o

I hope it can help you.

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0