JSFiddle - React, Tailwind, and code Playground

by 3gwebtrain

HTML

<div class="parent" id="parent">
  
 <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Distinctio vero, aliquam, ipsam eius expedita officiis quam, rerum sint nulla, blanditiis dolorum repudiandae. Adipisci numquam repudiandae vero, placeat ad consequatur animi?</div>
 <div>Cupiditate commodi cumque illum quod laborum sit, quisquam, recusandae sequi nulla. Architecto nisi, eos dignissimos possimus, pariatur non laborum, perspiciatis nihil officia omnis excepturi quidem aspernatur aliquam a rerum expedita.</div>
 <div>Omnis saepe neque reiciendis assumenda ea quidem accusantium dolores sit, temporibus. Saepe illum molestias cupiditate reprehenderit quas doloribus molestiae, aperiam ullam ex nesciunt repudiandae nihil, rerum odit! Alias, hic, deserunt.</div>
 <div>Similique libero voluptates nulla accusamus ducimus, laboriosam, natus incidunt soluta voluptatum mollitia obcaecati error quidem voluptate! Necessitatibus dolor, ipsa enim ipsum nihil, odit nisi voluptatum porro aliquid aperiam voluptas, in!</div>
 <div>Eos ea vero adipisci! Labore doloribus illum in. Placeat fugiat reiciendis, temporibus quas commodi neque earum distinctio, enim dolores ipsa quo voluptas nulla sit voluptatum, non a obcaecati iste quis.</div>
 <div>Laboriosam veritatis praesentium quas quos vitae ipsa voluptatibus quisquam modi dolores aperiam neque autem reprehenderit, vel temporibus minima adipisci sint commodi debitis ducimus. Soluta velit obcaecati ipsa, veritatis asperiores, expedita.</div>
 <div>Iusto, quis, consectetur. Quo, reiciendis ducimus! Tempore, illum eaque, soluta natus dolores ad consequatur perspiciatis voluptates maiores ab neque harum delectus labore! Vero iste, voluptatem nihil, consectetur tenetur nisi impedit?</div>
 <div>Repudiandae magni culpa eligendi itaque, quam necessitatibus, dignissimos velit cum eos perferendis iure molestias beatae ducimus nulla accusantium atque maxime ea tenetur enim veniam consequatur eius sed dolore sunt! Itaque!</div>
...

CSS

.parent{
  width: 150px;
  height: 300px;
  overflow: auto;
  border:1px solid red;
}

JavaScript

function scrollDown(){
	
   var positionId = document.getElementById('parent');
   positionId.scrollTop = positionId.scrollHeight;
   
}

scrollDown();