JSFiddle - React, Tailwind, and code Playground

HTML

<header class="header">

  <nav class="nav container">
    <a class="logo">logo</a>
    <ul class="menu">
      <li><a href="">link</a></li>
      <li><a href="">link</a></li>
      <li><a href="">link</a></li>
      <li><a href="">link</a></li>
    </ul>
  </nav>

</header>
<section class="container">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus cupiditate enim deleniti cumque, vel illo beatae tenetur dignissimos fugiat quis laudantium error, fuga architecto. Nesciunt suscipit nisi inventore sunt amet rerum. Nesciunt amet neque iure debitis optio recusandae itaque quibusdam adipisci error eius corporis culpa nemo quis, enim incidunt ipsa voluptates eos est eaque odit voluptatem iusto at quas libero! Consectetur suscipit quo maiores natus facilis, libero, in expedita veniam! Magnam eum modi ipsum, laboriosam ea cupiditate ipsa dolor inventore veniam maxime unde laborum ullam, eius vitae corporis, iusto officia. Tempore aliquid est distinctio excepturi, facilis nulla nobis fugit. Repellendus quibusdam modi eius laborum quisquam reprehenderit a magnam saepe cupiditate amet eveniet soluta, dicta sed? Vitae porro similique suscipit quos perspiciatis tempora laudantium quibusdam fuga est facilis consequatur obcaecati cum, cupiditate odio necessitatibus culpa. Nam fugit dignissimos necessitatibus incidunt omnis! Voluptate consequatur dicta odit hic tenetur cumque numquam voluptatum quibusdam quo quis ipsa, expedita corporis molestias illum! Tempora, tenetur officiis fugit aut quia voluptatem, rerum expedita voluptate dolore nihil maxime ad iste vero, asperiores ab dolorem temporibus. Voluptatibus enim inventore eius, fuga voluptatem voluptas repellendus. Enim asperiores nisi maxime reiciendis repudiandae non itaque dignissimos quo, dolor. Natus nostrum laborum ipsa est. Laudantium sint ullam, perferendis, aperiam quaerat itaque aliquid, sed nostrum quae enim natus quidem. Amet iste ducimus numquam exercitationem maxime dignissimos nam...

CSS

@import url('https://fonts.googleapis.com/css2?family=Neucha&display=swap');


* {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Neucha', cursive;
}
.container {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}
.header {
  position: sticky;
  top: 0;
  background: #eee;
}
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.menu {
  display: flex;
  list-style-type: none;
}

section + section {
  margin-top: 20px;
}