Footer at the bottom, but not fixed

Especially useful for pages with a few content.

by Ovi Stof

HTML

<html>
  <head>
  </head>
  <body>
    <h2>Footer at the bottom, but not fixed</h2>
      <a href="#">Test aspect link ordinar</a>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent mattis vitae tellus vel tempus. Sed egestas nibh nec ante condimentum, in sagittis diam condimentum. Aenean molestie purus eu mi vulputate dapibus. Donec posuere ipsum et nisi porta ornare. Nullam accumsan, tortor eget tincidunt mollis, eros odio varius lorem, sollicitudin pulvinar erat urna non felis. Aliquam erat volutpat. Quisque vitae metus nisl. Morbi molestie tristique laoreet. Mauris suscipit tellus vitae auctor molestie. Mauris consequat mattis sem, at dictum tellus tincidunt nec. Vivamus ante ligula, molestie eget vulputate non, porta interdum orci. Praesent justo arcu, tincidunt eu sodales eget, vestibulum id sem. In hac habitasse platea dictumst. Donec laoreet nisi a auctor dapibus. Cras vel commodo enim, non placerat nulla. Praesent et accumsan eros.</p>
    </div>
    <footer>Sursa: <a href="https://stackoverflow.com/questions/643879/css-to-make-html-page-footer-stay-at-bottom-of-the-page-with-a-minimum-height-b/25218797#25218797">StackOverflow.com</a></footer>
  </body>
</html>

CSS

html, body {
  display: table;
  height: 100%; /* OR 100vh */
  margin: 0 auto;
  width: 99%;
}
footer {
  background-color: lightblue;
  display: table-row;
  height: 0;
}