JSFiddle - React, Tailwind, and code Playground

HTML

<div class="Fixed1"></div>
<div class="scroll1">
  <p>1...</p>
  <p>&nbsp;</p>
  <p>2...</p>
  <p>&nbsp;</p>
  <p>3...</p>
  <p>&nbsp;</p>
  <p>4...</p>
  <p>&nbsp;</p>
  <p>5...</p>
  <p>&nbsp;</p>
  <p>6...</p>
  <p>&nbsp;</p>
  <p>7...</p>
  <p>&nbsp;</p>
  <p>8...</p>
  <p>&nbsp;</p>
  <p>9...</p>
</div>

CSS

.Fixed1 {
	color: #666;
	height: 200px;
	width: 100%;
	background-color: #06C;
	position: fixed;
	margin: auto;
}
.scroll1 {
	color: #333;
	height: 1000px;
	width: 720px;
	margin-right: auto;
	margin-left: auto;
    padding-left:50px;
	background-color: #CCC;
}