Expected behavior

I expect that the footer would stick to the bottom of the page and content would be justified above it.

Actual behavior

The footer sticks to the bottom of the page but it is cutting off my content. See the image below.

Resources (screenshots, code snippets etc.)

The code for my footer is as follows:

<footer class="page-footer font-small stylish-color-dark fixed-bottom pt-0 mt-5">
  <!-- Copyright -->
  <div class="footer-copyright text-center py-3">
    © {{date | date:'yyyy'}} 
  </div>
  <!-- Copyright -->
</footer>