How to make sure the footer is always at the bottom?
You can make use of the calc() expression, and use min-height instead of height. Say your footer height is 100px:

body{
  min-height : 100%;
  min-height: -moz-calc(100% - 100px); /* Firefox */
  min-height: -webkit-calc(100% - 100px); /* Chrome, Safari */
  min-height: calc(100% - 100px); /* IE9+ browsers */
}
footer{
  height: 100px;
}


Get more info about calc() here