title: Importing Static files to template with Django
body: <p>I'm having trouble loading my CSS file into my HTML template. Below are the invovled files I'm working with. Can anyone see why the CSS wouldn't be loading?</p>
  
  <p><strong>settings.py</strong></p>
  
  <pre><code>BASE_DIR = os.path.dirname(os.path.abspath(__file__))
  
  STATIC_ROOT = 'staticfiles'
  
  STATIC_URL = '/static/'
  
  STATICFILES_DIRS = (
      os.path.join(BASE_DIR, 'static'),
  ) 
  </code></pre>
  
  <p><strong>words.html</strong></p>
  
  <pre><code>{% load staticfiles %}
  
  &lt;link rel="stylesheet" type="text/css" href="{% static 'hello/words.css' %}" /&gt;
  </code></pre>
  
  <p><strong>urls.py</strong></p>
  
  <pre><code>urlpatterns = patterns('',
      url(r'^
      url(r'^Words', hello.views.index, name='index'),
      url(r'^db', hello.views.db, name='db'),
      url(r'^Add', hello.views.create, name='create'),
      url(r'^admin/', include(admin.site.urls)),
  )
  
  urlpatterns += staticfiles_urlpatterns()
  </code></pre>
  
  <p><strong>words.css</strong></p>
  
  <pre><code> .pri {
       color: blue;
   }, hello.views.index, name='index'),
  </code></pre>
  
  <p><strong><em>Project Structure</em></strong></p>
  
  <pre><code>murmurwall/
  ├── Procfile
  ├── README.md
  ├── hello
  │   ├── __init__.py
  │   ├── __init__.pyc
  │   ├── __pycache__
  │   │   ├── __init__.cpython-34.pyc
  │   │   ├── admin.cpython-34.pyc
  │   │   ├── forms.cpython-34.pyc
  │   │   ├── models.cpython-34.pyc
  │   │   └── views.cpython-34.pyc
  │   ├── admin.py
  │   ├── admin.pyc
  │   ├── forms.py
  │   ├── forms.pyc
  │   ├── management
  │   │   └── commands
  │   │       ├── CSV
  │   │       │   └── Pretty\ Little\ Liars.csv
  │   │       ├── __pycache__
  │   │       │   └── update_words.cpython-34.pyc
  │   │       └── update_words.py
  │   ├── models.py
  │   ├── models.pyc
  │   ├── static
  │   │   └── hello
  │   │       └── words.css
  │   ├── templates
  │   │   ├── add_word.html
  │   │   ├── base.html
  │   │   ├── db.html
  │   │   └── words.html
  │   ├── tests.py
  │   ├── views.py
  │   └── views.pyc
  ├── manage.py
  ├── murmurwall
  │   ├── __init__.py
  │   ├── __init__.pyc
  │   ├── __pycache__
  │   │   ├── __init__.cpython-34.pyc
  │   │   ├── settings.cpython-34.pyc
  │   │   ├── urls.cpython-34.pyc
  │   │   └── wsgi.cpython-34.pyc
  │   ├── settings.py
  │   ├── settings.pyc
  │   ├── static
  │   │   └── humans.txt
  │   ├── urls.py
  │   ├── urls.pyc
  │   ├── wsgi.py
  │   └── wsgi.pyc
  ├── requirements.txt
  ├── runtime.txt
  └── staticfiles
      ├── admin
      │   ├── css
      │   │   ├── base.css
      │   │   ├── changelists.css
      │   │   ├── dashboard.css
      │   │   ├── forms.css
      │   │   ├── ie.css
      │   │   ├── login.css
      │   │   ├── rtl.css
      │   │   └── widgets.css
      │   ├── img
      │   │   ├── changelist-bg.gif
      │   │   ├── changelist-bg_rtl.gif
      │   │   ├── default-bg-reverse.gif
      │   │   ├── default-bg.gif
      │   │   ├── deleted-overlay.gif
      │   │   ├── gis
      │   │   │   ├── move_vertex_off.png
      │   │   │   └── move_vertex_on.png
      │   │   ├── icon-no.gif
      │   │   ├── icon-unknown.gif
      │   │   ├── icon-yes.gif
      │   │   ├── icon_addlink.gif
      │   │   ├── icon_alert.gif
      │   │   ├── icon_calendar.gif
      │   │   ├── icon_changelink.gif
      │   │   ├── icon_clock.gif
      │   │   ├── icon_deletelink.gif
      │   │   ├── icon_error.gif
      │   │   ├── icon_searchbox.png
      │   │   ├── icon_success.gif
      │   │   ├── inline-delete-8bit.png
      │   │   ├── inline-delete.png
      │   │   ├── inline-restore-8bit.png
      │   │   ├── inline-restore.png
      │   │   ├── inline-splitter-bg.gif
      │   │   ├── nav-bg-grabber.gif
      │   │   ├── nav-bg-reverse.gif
      │   │   ├── nav-bg-selected.gif
      │   │   ├── nav-bg.gif
      │   │   ├── selector-icons.gif
      │   │   ├── selector-search.gif
      │   │   ├── sorting-icons.gif
      │   │   ├── tooltag-add.png
      │   │   └── tooltag-arrowright.png
      │   └── js
      │       ├── LICENSE-JQUERY.txt
      │       ├── SelectBox.js
      │       ├── SelectFilter2.js
      │       ├── actions.js
      │       ├── actions.min.js
      │       ├── admin
      │       │   ├── DateTimeShortcuts.js
      │       │   └── RelatedObjectLookups.js
      │       ├── calendar.js
      │       ├── collapse.js
      │       ├── collapse.min.js
      │       ├── core.js
      │       ├── inlines.js
      │       ├── inlines.min.js
      │       ├── jquery.init.js
      │       ├── jquery.js
      │       ├── jquery.min.js
      │       ├── prepopulate.js
      │       ├── prepopulate.min.js
      │       ├── timeparse.js
      │       └── urlify.js
      ├── hello
      │   └── words.css
      └── humans.txt
  </code></pre>