JSFiddle - React, Tailwind, and code Playground

by Jesse M

HTML

<div id="container1">
  <div id="sticky">Sticky Stuff</div>
</div>
<div id="container2">
</div>

CSS

#container1 {
  position: relative;
  background: #CCC;
  min-height: 600px;
  display: block;
  width: 100%;
  padding: 1.5rem;
  box-sizing: border-box;
}

#container2 {
  min-height: 500px;
  background: #FFF;
}

#sticky {
  position: sticky;
  top: 1.5rem;
  background: #4d4d4d;
  padding: 1rem;
  color: #FFF;
  display: block;
  margin: 0 auto;
}