Django - CSS stops working when I change urls

Question

So I ran into a problem on my website where I then created two separate html pages. I then edited the urls.py so the urls would be different for the 2 pages but the css stops working if I do this. My code is below and I will explain more thoroughly after.

part of my head.html

<!-- Bootstrap core CSS -->


<link href="../../static/textchange/index.css" rel="stylesheet">

<!-- Custom styles for this template -->
<link href="../../static/textchange/jumbotron.css" rel="stylesheet">

<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../../static/textchange/index.js"></script>

How I include head on each html page

{% include "textchange/head.html" %}

The two urls causing problems

url(r'^results/(?P<uisbn>(\w)+)/(?P<uuser>(\w)+)$', views.contactpost, name="contactpost"),
url(r'^results/(?P<uisbn>(\w)+)/(?P<uuser>(\w)+)$', views.contactwish, name="contactwish"),

So the above is how my urls are setup at the moment and I realize this will only ever go to contactpost at the moment. When I change the urls like this:

url(r'^results/(?P<uisbn>(\w)+)/post/(?P<uuser>(\w)+)$', views.contactpost, name="contactpost"),
url(r'^results/(?P<uisbn>(\w)+)/wish/(?P<uuser>(\w)+)$', views.contactwish, name="contactwish"),

The CSS stops working for both pages.

Initially before I had 2 pages the url looked like this:

url(r'^results/(?P<uisbn>(\w)+)/(?P<uuser>(\w)+)$', views.contact, name="contact"),

Views.py

@login_required
def contactpost(request, uuser, uisbn):
    ltextbook = Textbook.objects.filter(isbn = uisbn)
    text = ltextbook[0]
    luser = User.objects.filter(username = uuser)
    quser = luser[0]
    post = Posting.objects.filter((Q(user = quser) & Q(textbook = ltextbook)))
    posting = post[0]
    return render_to_response(
        'textchange/contactpost.html',
        locals(),
        context_instance=RequestContext(request)
        )

@login_required
def contactwish(request, uuser, uisbn):
    ltextbook = Textbook.objects.filter(isbn = uisbn)
    text = ltextbook[0]
    luser = User.objects.filter(username = uuser)
    quser = luser[0]
    wish = Wishlist.objects.filter((Q(user = quser) & Q(textbook = ltextbook)))
    wishlist = wish[0]
    return render_to_response(
        'textchange/contactwish.html',
        locals(),
        context_instance=RequestContext(request)
        )

Why would the CSS stop working?

Thanks.

Answer 1

The URL for static is going up two directories; but your path is now three directories deep, so the URL is wrong.

You shouldn't be using relative URLs for your static links. Instead, use absolute ones:

<link href="/static/textchange/index.css" rel="stylesheet">

even better, use the {% static %} tag which takes the value of STATIC_URL from your settings file.

<link href="{% static "textchange/index.css" %}" rel="stylesheet">