Issue with file path reaching into the public directory

Here is the image of the folder path:-

https://i.sstatic.net/GESWX.png

The CSS file seems to not be working in the exercises folder. It is only importing the header-ejs file without any styles, but it works fine for chapters and other files. How can I resolve this issue?

Below is the codeimage for exercise.ejs:

https://i.sstatic.net/LLjbk.png

For reference, here is the link to the chapters.ejs file:

https://i.sstatic.net/e6k9R.png

Answer №1

In my setup, I organized my project with a public folder containing a css subfolder where my styles.css file was located. To reference this CSS file in my header.ejs file, I used the path css/styles.css. The header.ejs file was stored within the views/partials directory. Take a glance at the image.https://i.sstatic.net/VpvJY.png

<link rel="stylesheet" href="css/styles.css"> - This is the code snippet from my header.ejs

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilizing React Router with HTML5 pushstate in conjunction with Nginx servers

I am working on a React app with react-router and HTML5 pushstate routes. I want to use http://example.com/v2 as the base route for serving my new website. Below are the nginx configurations that I am using: This configuration is designed to catch reques ...

"Creating a new element caused the inline-block display to malfunction

Can someone explain why the createElement function is not maintaining inline-block whitespace between elements? Example problem First rectangle shows normal html string concatenation: var htmlString = '<div class='inline-block'...>&l ...

Expiration time set as default for JWT token

Can someone clarify the default expiry time of a JWT token? I tried generating a JWT token without specifying an expiry time, but I couldn't find information on the token's expiry time. function generateToken(payload) { return jwt.sign(payload ...

Is it possible to use wildcards in Socket.io rooms or namespaces?

The hierarchy I am working with is as follows: Store -> Manager -> Assistant In this setup, a Manager has access to everything that the Assistant sends, while the Assistant can only access what the Manager explicitly provides. My understanding is t ...

Having trouble getting the <script> tag to function properly in HTML <head> or an external JS file

Attempting to include js in an HTML file. Imported the external js files using the script tags below <script type="text/javascript" src="scripts/ui.js"></script> <script type="text/javascript" src="scripts/events.js"></script> Unf ...

What is the best way to align a jQuery Cycle 2 Slider in the middle of the

Having some trouble centering a jQuery Cycle 2 Slider on my page. You can see the slider here. I've attempted multiple methods to center it, but none have been successful. Check out the HTML code: <div class="slider"> <div id=outside> ...

Once AJAX/GET has been utilized, further execution of jq functions such as .click may not be

I'm facing an issue with AJAX/GET code. After reloading data from a PHP file using jQuery, I have another block of code that my problem lies in the fact that after reloading data from MySQL/PHP server while the page refreshes, I can't use functio ...

Nuxt.js: The renderer resources failed to load. Make sure to review any potential console errors and verify the dist folder

Encountering an error on my Nuxt staging site: NuxtServerError Renderer resources are not loaded! Please check possible console errors and ensure dist (C:\Users\xyz\.nuxt\dist\server) exists. No console errors, just a '500 er ...

Creating dynamic routes in express.js with fixed components

I'm exploring how to create a route in express that captures URLs like this: /events/0.json Here's what I've attempted so far (but it's not working as expected): router.put('/events.json/:id.json', isLogged, events.update) ...

Issue with Material Design Lite input floating label not functioning properly post page navigation

I am currently developing a mobile hybrid application using Material Design Lite, but I have run into a small issue. When I add input field elements to my pages, the floating text and placeholder do not function properly. In my application, I am utilizing ...

What is the best way to extract a JSON value and use it across multiple functions?

Currently, everything seems to be working fine. However, I'm unsure about the correct way to call the json data. I attempted using a direct link but it didn't work. Do I need to modify the "data" parameters? I'm confused because I saw that ...

I am looking for a highly specialized jQuery selector that fits my exact requirements

Hello everyone, I'm encountering an issue with a jQuery selector. Here is the HTML code snippet: <div id="Id_Province_chzn"> <a href="javascript:void(0)" class="chzn-single chzn-default" tabindex="-1"> <span> + this.default_tex ...

"XLSX Node: The Ultimate Tool for Creating Excel Spreadsheets

I am currently working on using exceljs to generate an Excel file from a MongoDB collection. This is my MongoDB collection structure: { "id": "01", "make": "toyota", "year": [ 2005, 2006, 2007, 2008, 2009, 2010 ], "model ...

Arrange components with minimal spacing

I am currently working on a design that requires a perfectly aligned table using divs. Here is what I have done so far: My goal is to have the time section placed on the left side of the entire row, while keeping the text right-aligned to avoid creating a ...

Tips for creating a "sticky" button in Angular that reveals a menu when clicked

Is there a way to incorporate a feature similar to the "Get help" button on this website: The button, located in the lower right corner, opens a sticky chat menu. I am interested in adding dynamic information to the button (such as the number of tasks a u ...

Internet Explorer 10 offers 3D transformation capabilities

My 3D rotating image carousel works well in Chrome and Firefox but not in IE. I am aware that IE10+ does not fully support the preserve-3d tag, and although there are workarounds by applying transforms to the children instead, I have been unsuccessful in ...

How can you inform TypeScript about a file that will be included using a script tag?

I am currently utilizing TypeScript for my front-end JavaScript development, and I have a situation where I am loading two scripts from my index.html file as shown below: <script src="replacements.js"></script> <script src="socket.js">&l ...

Error in updating property values within an array with Mongoose

These are the Schema Details export const publicTaskSchema = new Schema({ task: { required: true, type: String }, user: { _user: { type: String, required: true }, userName: { type: String, required: true }, }, likes: { users: [{ ...

What is the process for browserifying the net.Socket module in Node.js?

I'm exploring ways to connect and query my MS SQL database from JavaScript in a web browser (specifically Chrome, not IE as I don't want to use ActiveX controls). I came across this Node library called Tedious and Browserify to help with this tas ...

Is there a sweet syntax for CSS variables available?

What about using this instead: :root { --primary-color: gray; --secondary-color: lightgray; } var(--pc) Is there a more concise syntax available, perhaps shorter than var(--pc)? ...