CSS back not linkiing

#1

index.html
{% load staticfiles %}

<!doctype html>
<html>
    <head>
        <title>My Hello Web App</title>
        <link rel='stylesheet' href="{% static '../static/css/style.css' %}" />
    </head>
    <body>
        <h1>Hello World!</h1>
        <p>I am a basic website.</p>
    </body>
</html>

style.css

body
{
    background-color: cornflowerblue;
}

In my index.html file I’ve tried the href relative path both with and without ../static/. Any ideas? I know the focus here is on python and django but I can’t move forward as long as this simple problem stays in my way.

#2

What does your HTML look like in the browser? (View source in the browser, look at the outputted code.) AKA, what gets put there as the link by Django?

#3

index.html

{% load staticfiles %}

<!doctype html>
<html>
    <head>
        <title>My Hello Web App</title>
        <link rel='stylesheet' href="{% static 'css/style.css' %}" />
    </head>
    <body>
        <h1>Hello World!</h1>
        <p>I am a basic website.</p>
    </body>
</html>

Source in browser

<!doctype html>
<html>
	<head>
		<title>My Hello Web App</title>
		<link rel='stylesheet' href="/static/css/style.css" />
	</head>
	<body>
		<h1>Hello World!</h1>
		<p>I am a basic website.</p>
	</body>
</html>

Any ideas? When I see /static/css/style.css it makes me think that it’s using an absolute path all the way from the root / directory, and if that’s is the case then that path doesn’t even exist. But I don’t much about Django, Does Django consider the leading / to be the root of the web directory?

#4

Is style.css in the /static/css/ directory under your app (named “collection” in HWA)?

#5

It is indeed.

user@mothership css $ pwd
/home/user/projects/learningCenter/django-projects/helloworldapp/collection/static/css
user@mothership css $ ls -l
total 4
-rw-r--r-- 1 user user 34 Dec 24 16:33 style.css
user@mothership css $
#6

Ugh due to holidays I have mush brain.

Just noticed your template code has
<link rel='stylesheet' href="{% static '../static/css/style.css' %}" />

When it should be this:

If that doesn’t fix the problem, go through the rest of your code and see if there are any more differences between the book and your code. :) You can also see the code here: https://github.com/hellowebapp/hellowebapp-code/ (change the chapter under the “branch” button.

#7

On the bottom of my first post on this tread I did mention that I tried it with and without the `…/static/’. Neither way is working.

#8

Can you upload your current code (matching the book, so make sure to remove the …/static/ part) to a public github repo so I can check everything?

#9

I think there’s some caching going on. I had the same issue and the CSS only started to be applied after I restarted the server.