JSFiddle - React, Tailwind, and code Playground

by xXJD25

HTML

<div id="scroll">
     <p>Try to add more text</p>
 </div>

<p> here's the max height when adding a text automatic scroll when the max height is in 200px </p>

<div id="scroll">
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
        <p>SCROLL</p>
 </div

CSS

#scroll {
       overflow-y:auto;
       height:auto;
       max-height:200px;
       border:1px solid black;
       width:200px;
     }