Як притиснути підвал сайту до низу

Головна
Блог
Front-end
Як притиснути підвал сайту до низу

Простий HTML код для прикладу:

<body>
    <header class="header">
      Site header
    </header>
    <div class="main-area">
      Main content of page
    </div>
    <footer class="footer">
      Site footer
    </footer>
</body>

CSS код, який змусить footer (підвал сайту) притиснутися до низу вікна браузера:

body{
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}
.main-area {
    flex: 1 0 auto;
}