JSFiddle - React, Tailwind, and code Playground
HTML
<div id="parent">
<div id="child1">
<h2>Header</h2>
<p>Paragraph. I don't know ho long it will be.</p>
<p>Very long paragraph</p>
<p>Very long paragraph</p>
<p>Very long paragraph</p>
<p>Very long paragraph</p>
<p>Very long paragraph</p>
</div>
<div id="child2">
<ul>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
...
CSS
#parent {
background-color: cornflowerblue;
max-width: 700px;
height: 480px;
margin: 0 auto;
text-align: center;
padding: 5px;
}
#child2 {
overflow: auto;
}
#child2 ul {
list-style: none;
margin: 0;
padding 0;
}