css file not loading for a particular route in ejs file

Question

I have two routes for a webpage. I am loading the same app.css file for both pages. The app.css file is inside /public directory. my folder structure

var express = require("express");
var app = express();

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

app.get("/", function(req, res) {

    res.render("home.ejs");
});

app.get("/fall/:thing", function(req, res) {
    var thing = req.params.thing;
    res.render("myThing.ejs", {thingVariable: thing});
});

Inside my.ejs file i do something like this to load it.

<link rel="stylesheet" href="app.css">

<h1>things ejs file</h1>

<link rel="stylesheet" href="app.css">

<h1>Home page</h1>

The css file only loads for the first page ( "/" ) and does not load for "/fall/:thing" . What am i doing wrong. Btw if i rename the second route as "/:thing" , the css loads this time. What is the issue here?

Answer 1

If the app.js is present in current directory then indicate it. Something like this:

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