<div class="page-wrap">
  
  Content!
  
      <footer class="site-footer">
        I'm the Sticky Footer.
      </footer>
</div>

* {
  margin: 0;
}
html, body {
  height: 100%;
}
.page-wrap {
  min-height: 100%;
  /* equal to footer height */
  padding-bottom: 142px; 
  box-sizing:border-box;
}
.site-footer {
  position:absolute;
  bottom:0;
  width:100%;
  height: 142px; 
  background: orange;
}