CSS solution to keep footer at the bottom of the page even when there is not enough content to do so normally. http://codepen.io/lewis-rodgers/pen/RoPgdN

sticky-footer.html

<style>
  html,
  body {
    height: 100%;
  }
  .wrapper {
    min-height: 100%;
  }
  .content {
    padding-bottom: 60px; /* Greater than or equal to height of footer */
  }
  .footer {
    margin-top: -60px; /* Slots into void created by padding-bottom in .content */
    height: 60px;
  }
</style>


<div class="wrapper">
  <div class="content">Main content</div>
</div>

<div class="footer"></div>