<header>
  ヘッダー
</header>

<main>
  コンテンツ
</main>

<footer class="footer">
  フッター
</footer>
body {
  min-height: 100dvh;
}

.footer {
  position: sticky;
  top: 100%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.