Positioning an element in block content Django?

Question

css

Footer slides into block content
There is base.html

<!-- main container -->
<div class = 'container'>
{% block content %}
{% endblock %}
</div>
<!-- FOOTER -->
<div class="footer"><strong>aaa</strong> 2017.</div>

There is a page with block content

{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% block head_title %}

  {{ block.super }} | {{ instance.title }} 

{% endblock head_title %}


{% block content %}
  <div class ='col-sm-8'>
    {% if instance.image %}
    <img src='{{instance.image.url}}' class='img-responsive' />
    {% endif %}
    <hr>
    <h1>{{ title }}</br><small> {{instance.timestamp}}  </small></h1>
    {% if instance.user.get_full_name %} 
      <p>Author: {{ instance.user.get_full_name }}</p> 
    {% endif %} 
  </hr>
<hr>
<div class='content-markdown'>{{instance.content}}</br></div>
{% endblock content %}

There is base.css

.footer {
  position: relative;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: #141414;
  text-align: center;
}
.footer strong{
  color:#fff;
}

Actually, on all pages, the footer is displayed as it should, centered at the bottom, and in block content it is displayed before the container block.
How to display the footer in the same way as on other pages?
How it should be

Like on a page with block content