-2

I am building a web application and trying to link a stylesheet to my app. Here is my code

<html>
    <head>
        <title>Bubble</title>
    </head>
    <link rel="stylesheet" href="./public/main.css">   
<body>

The app is located in the direct DrDenver/blog. The full style sheet is located in DrDenver/blog/public.

JS Bach
  • 83
  • 1
  • 5
  • 15
  • https://stackoverflow.com/a/21828923/1650337 – DBS Nov 08 '17 at 21:28
  • what error do you get in console or network tab? – derloopkat Nov 08 '17 at 21:29
  • 2
    Possible duplicate of [Absolute vs relative URLs](https://stackoverflow.com/questions/2005079/absolute-vs-relative-urls) – ceejayoz Nov 08 '17 at 21:31
  • 1
    Doesn't matter where "the app" is located, what matters is where this HTML document is located in relation to the stylesheet. If the document is in public/, then ... – CBroe Nov 08 '17 at 21:32

2 Answers2

0

Remove the dot and slash. you are looking above the dir instead of within. Try This.

<link rel="stylesheet" href="public/main.css">
Jonny
  • 1,319
  • 1
  • 14
  • 26
  • I tried that I got this error Failed to load resource: the server responded with a status of 404 (Not Found) – JS Bach Nov 08 '17 at 21:46
  • move your style sheet to the same folder as your html and see if it works. remember to connect like this href = "main.css". Remove public. Sometimes if you are using a App it will have problems with the dir. – Jonny Nov 08 '17 at 21:52
  • If that dont work copy and paste both to your desktop and check it. – Jonny Nov 08 '17 at 21:53
  • I am using c9 and I placed both the app.js and main.css into the same folder and I am still getting the 404 error messages. – JS Bach Nov 08 '17 at 22:06
0

I added this line to my app.js

app.use(express.static(__dirname +"/public"));

And updated the code on my header.ejs to after moving the main.css to public/stylesheet directory.

link rel="stylesheet" href="/stylesheets/main.css"
JS Bach
  • 83
  • 1
  • 5
  • 15