LearnWeb

* {
  margin: 0;
}

html, body {
  height: 100%;
}

.page-wrap {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -142px;
}

.page-wrap:after {
  content: "";
  display: block;
}
.site-footer, .page-wrap:after {
  height: 142px;
}
.site-footer {
  background: orange;
  height: 80px; /* Works well if you use a fixed height */
}