JSFiddle - React, Tailwind, and code Playground

by Aaron von Schassen

HTML

<html>

  <head>
  </head>

  <body>
    <div class="container">
      <section id="one">
        <h1>One</h1>
        <a href="#two">Two</a>
        <a href="#three">Three</a>
      </section>
      <section id="two">
        <a href="#one">One</a>
        <h1>Two</h1>
        <a href="#three">Three</a>
      </section>
      <section id="three">
        <a href="#one">One</a>
        <a href="#two">Two</a>
        <h1>Three</h1>
      </section>
    </div>
  </body>

</html>

CSS

html,
body {
  overflow: hidden;
  scroll-behavior: smooth;
}

section {
  height: 100vh;
  width: 100vw;
  padding: 0;
  margin: 0;
}

#one {
  background-color: yellow;
}

#two {
  background-color: blue;
}

#three {
  background-color: red;
}