JSFiddle - React, Tailwind, and code Playground

HTML

<meta name="viewport" content="width=device-width, minimum-scale=1.0, user-scalable=no">
<script  src="http://code.jquery.com/jquery-latest.min.js"></script>

<style>
#test { 
	background:#fff; 
	border:1px solid #ccc; 
	text-align:center; 
	position:fixed; 
	width:80%; 
	height:250px;
	left:50%; 
	margin:1rem auto; 
	margin-left:-40%;  
	overflow-y:scroll; 
	z-index:100; 
	-webkit-overflow-scrolling:touch;
}
#black { 
	background-color:rgba(0,0,0,0.5); 
	width:100%; 
	height:100%; 
	top:0; left:0; 
	position:fixed;
}
</style>

<div id="black"></div>
<div id="test">
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
	<BR>AAAAAAAAAAAAAAA
</div>