Extending Django and CSS Templates

I have a basic template like this:

<head> <title>{% block title %}{% endblock %}</title> <link rel="stylesheet" href="/static/style.css"/> 

And this text is in the logs when I refresh the page:

 [01/Dec/2011 18:22:00] "GET /search/ HTTP/1.1" 200 2760 [01/Dec/2011 18:22:00] "GET /static/style.css HTTP/1.1" 200 54 

So that means CSS is loading from the server correctly. But that will not work! If I include this CSS as text directly in the base template, it will work correctly. The configuration of the static files is fine.

+7
source share
4 answers

Do you put css in a block that puts it at the top of the base?

 /* base.html */ <html> <head> <title>{% block title %}{% endblock %}</title> {% block extra_head %}{% endblock %} </head> <body> {% block content %}{% endblock %} </body> </html> /* another template */ {% extends 'base.html' %} {% block title %}My Title{% endblock %} {% block extra_head %} <link rel="stylesheet" href="/static/style.css"/> {% endblock %} {% block content %} <h1>This is my page!</h1> {% endblock %} 

In your browser, what does the source code of the page look like? Is the stylesheet in the head? can you click the link and see the actual css?

+14
source

This is an extremely late answer, but perhaps more relevant now than it would be five years ago. Make sure that the editable style sheet is not created by the server hosting your site.

I don’t quite understand that @RankoR made changes to the style.css file, and they were not reflected on the site, or if zero styles were applied to the template at all, but if you run the first one: you can quickly exclude the possibility that it is created somewhere between you and its final, displayed state, adding your own .css folder to the root folder and adding the definition to it that you are trying to change,

Suppose you are trying to customize your navigation style - if you want to change .navbar-inverse {background-color: #222; border-color: #090909 } .navbar-inverse {background-color: #222; border-color: #090909 } on .navbar-inverse {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } .navbar-inverse {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } .navbar-inverse {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } , add to your new empty .css file .navbar-inverse2 {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } .navbar-inverse2 {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } .navbar-inverse2 {background-color: #222; border-color: #090909; font:20px bold Arial, sans-serif } and change the .navbar-inverse in your html to navbar-inverse2 . If you just linked your stylesheet under the original in <head> , and this change happened: you are heading to Solution Town!

+2
source

What does "not work" mean? Is the style performed, are there no images, etc.? Are you sure you saved the changes to the CSS file? It seems the file was found in /static/style.css, so presumably there is something ...

+1
source

Are you using STATIC_URL or MEDIA_URL to access css? If so, have django.contrib.contenttypes been added to the installed applications in the settings? Also check the STATICFILES_DIRS and STATIC_ROOT / MEDIA_ROOT settings. See https://docs.djangoproject.com/en/1.3/ref/contrib/staticfiles/ for more details. Also, if you use MEDIA_URL, you can try using the media root in the urls, something like:

 if settings.DEBUG: urlpatterns += patterns('', (r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT, 'show_indexes': True}), ) 
0
source

All Articles