JSFiddle - React, Tailwind, and code Playground

HTML

<div data-container>
  <span data-sticky>sticky</span>
  <p>
    Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>Endless content goes here<br>
  </p>
</div>

CSS

html,body{
  margin:0;
}

div{
  position:relative;
  width:200px;
  height:200px;
  display:block;
  padding:40px 5px;
  margin:50px auto;
  overflow-y:scroll;
  background:#ddd;
  border:1px solid #000;
}
div span{
  position:absolute;
  top:0;
  right:0;
  background:#fff;
  background:#ccc;
  padding:5px;
  border:1px solid #000;
  margin:20px 20px 0 0; /* set this to get it from top right */
}

JavaScript

$(document).ready(function(){
	$('[data-container]').scroll(function(){
    $('[data-sticky]').css(
    	'top', $(this).scrollTop()+'px'
    );
  });
  $('[data-container]').scroll();
});