I have been struggling to resolve an issue on my website for the past two days. The browser is not applying the CSS styling to a specific page, while all other pages on the site are working fine with CSS. Here is the code for the problematic page:
<!DOCTYPE html>
<html lang="en">
<head>
<%include partails/head %>
<link rel="stylesheet" href="../stylesheets/resultPage.css"/>
</head>
<body>
<% include partails/header %>
<h3 class="h3 mb-3 font-weight-normal text-center" id="title">نتيجة
الأختبار</h3>
<div class="container">
<div class="row">
<div class="col-md-10">
Additionally, here is the code snippet from my app.js file for uploading the CSS file:
app.use(express.static("public"));
app.set("view engine" , "ejs");
app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json())
app.use(methodOverride("_method"));
Furthermore, here is the file path structure where the CSS file is located:
- Samples10
- public
- stylesheets
- resultPage.css
- stylesheets
- View
- resultPage.ejs
- public
Lastly, I received the following error message in the browser:
Refused to apply style from 'http://localhost:3000/result/5b31bbcacc2864263d40d240/stylesheets/resultPage.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
If anyone can offer assistance, I would greatly appreciate it. Thank you.