JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">

  <header class="header">шапка</header>
  <aside class="aside">
    <nav>
      <ul>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
        <li><a href="">text</a></li>
      </ul>
    </nav>
  </aside>
  <main class="main">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat praesentium, id eveniet error aperiam facilis fugit beatae nobis ut debitis accusamus unde! Reprehenderit nesciunt, mollitia accusamus earum sint, voluptas optio nihil, recusandae eius molestiae eum omnis. At, dignissimos veritatis facere minima suscipit similique molestiae consequatur cumque nemo nam, ullam quo, quibusdam. Saepe repudiandae recusandae ipsum ex atque soluta quas nihil, obcaecati consequatur nulla quisquam, eos laudantium vel laboriosam voluptatum deleniti a autem fugiat accusamus ad impedit quasi tempore veniam facere minima. Quisquam possimus magnam perferendis optio nam. Nam nisi aliquam, voluptatibus, ducimus nulla perspiciatis numquam. Nisi perferendis maxime eaque commodi beatae temporibus quam distinctio doloribus eius delectus reprehenderit eum dolor error adipisci id necessitatibus, quos tenetur ex cupiditate tempore quia magni. Illo, sunt! Vitae mollitia dicta illum laborum placeat, saepe, nam, quisquam sed tempora incidunt accusamus! Repellendus iste ut dolore voluptas omnis vitae ex perferendis, qui similique dolor error eius laborum quisquam natus voluptatem magnam repudiandae voluptatum reprehenderit. Deserunt ipsam ut ratione earum tempora inventore quo soluta corrupti beatae odio suscipit, expedita mollitia dolores pariatur nobis fugiat amet incidunt, ad iusto molestiae excepturi autem obcaecati. Placeat modi corrupti dolore quas quos sed delectus repellendus, commodi neque quae eaque tempore obcaecati!</main>
</div>

CSS

* {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}
body {
  margin: 0;
}

.wrapper {
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-template-rows: min-content 1fr;
  min-height: 100vh;
}
.header {
  grid-column: 1/-1;
}
.aside {
  padding: 20px;
  background: #eee;
}