JSFiddle - React, Tailwind, and code Playground

by csornmo

HTML

<div class="wrapper">
  <div class="main">
    Main content
  </div>
  <div class="sidebar">
    Sticky sidebar
  </div>
</div>

CSS

.wrapper {
  display: flex;
  justify-content: space-between;
}

.main,
.sidebar {
  border: 3px solid black;
  padding: 15px;
  background-color: #fff;
}

.main {
  width: 60%;
  height: 150vh;
}

.sidebar {
  width: 25%;
  height: 25vh;

  position: -webkit-sticky;
  position: sticky;
  top: 0;
}