IvanErlic2000 IvanErlic2000 -4 years ago 117
CSS Question

CSS file is linked but doesnt affect the page

I linked the css file and in the browser inspect mode i can see and open it but it doesn't affect the page.

This is my layout.pug file:

1 doctype html
2 html
3 head
4 link(href="/stylesheets/app.css", type="text/css", ref="stylesheet")
5 block title
6 body
7 block content

This is my index.pug file:

1 extends layout
3 block title
4 title Index
6 block content
7 h1 Books
9 div
10 a(href='new') New Book
12 table
13 th Title
14 th Author
15 each book in books
16 tr
17 td= book.title
18 td= book.author
19 td (show)
20 td (delete)

This is my app.css file:

1 h1 {
2 color: blue;
3 }

What am I missing? Why the header didn't change colour?

Answer Source

The first error I spot is a simple typo: The attribute of link is rel (not ref).

Another thing that caught my eye (but is is just a suspicion) is about the href attribute: Is the heading slash correct?

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download