<header>ヘッダーだよ</header>
<main>
  ここにメイン要素を書くよ<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />ヤッホー
</main>
<footer>フッターだよ</footer>
@charset "utf-8";

body {
  margin: 0px;
}

header {
  position: fixed;
  top: 0px;
  width: 100vw;
  background-color: rgba(245, 178, 177, 0.5);
}

main {
  margin-top: 24px;
  background-color: rgba(255, 253, 237, 1);
}

footer {
  position: fixed;
  bottom: 0px;
  width: 100%;
  background-color: rgba(201, 187, 155, 0.5);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.