JSFiddle - React, Tailwind, and code Playground

by peroli

HTML

<div class="top">
  <div class="content">
    <p>1</p>
    <p>2</p>
    <p>3</p>
    <p>4</p>
    <p>5</p>
    <p>6</p>
    <p>7</p>
    <p>8</p>
    <p>9</p>
    <p>10</p>
  </div>
</div>

CSS

.top{height:90px;width:30px; overflow:auto;margin-top:75px;}
p{background-color:red;}

JavaScript

//select <p>5</p> and scroll that element into view, I pass children '4' because its a zero index array-like structure
document.querySelector('.content').children[4].scrollIntoView(false);