title: Cant extend html template on Django
body: <p>I cant extends one html document (child - base_home.html) to another parent html document - base.html
  I have next Django project structure:</p>
  
  <pre><code>Testdjango/
  blog/
     migrations/
     templates/
         blog/
            base.html
            base_home.html
     __init.py__
     admin.py
     apps.py
     models.py
     tests.py
     urls.py
     views.py
  db.sqlite3
  manage.py
  </code></pre>
  
  <p>My parent template is a base.html, with the next code:</p>
  
  <pre><code>   &lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
      &lt;!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --&gt;
      &lt;meta name="description" content=""&gt;
      &lt;meta name="author" content=""&gt;
      &lt;title&gt;{% block title %}{% endblock %} &amp;ndash; Blog&lt;/title&gt;
  
      &lt;!-- Bootstrap core CSS --&gt;
      &lt;link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/journal/bootstrap.min.css" rel="stylesheet"&gt;
  
      &lt;!-- Custom styles for this template
      &lt;link href="starter-template.css" rel="stylesheet"&gt; --&gt;
  
      &lt;/head&gt;
  
    &lt;body&gt;
  
      &lt;nav class="navbar navbar-inverse navbar-fixed-top"&gt;
        &lt;div class="container"&gt;
          &lt;div class="navbar-header"&gt;
            &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"&gt;
              &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;/button&gt;
            &lt;a class="navbar-brand" href="#"&gt;Blog&lt;/a&gt;
          &lt;/div&gt;
          &lt;div id="navbar" class="collapse navbar-collapse"&gt;
            &lt;ul class="nav navbar-nav"&gt;
              &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#about"&gt;About&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;&lt;!--/.nav-collapse --&gt;
        &lt;/div&gt;
      &lt;/nav&gt;
  
      &lt;div class="container"&gt;
          {% block content %}
          {% endblock %}
  
      &lt;/div&gt;
      &lt;!-- Bootstrap core JavaScript
      ================================================== --&gt;
      &lt;!-- Placed at the end of the document so the pages load faster --&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
         &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;
       &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And my "child" base_home.html have next code:</p>
  
  <pre><code>{% extends "blog/base.html" %}
  {% block title %}
  Home
  {% endblock %}
  {% block content %}
  Lorem bla bla
  {% endblock %}
  </code></pre>
  
  <p>And in page i cant see anything from base_home.html</p>