JSFiddle - React, Tailwind, and code Playground

HTML

<div id="dashboard">
    <table>
        <tr>
            <td><div id="cell1">cell1</div></td>
            <td><div id="cell2">cell2</div></td>
            <td><div id="cell3">cell3</div></td>
            <td><div id="cell4">cell4</div></td>
            <td><div id="cell5">cell5</div></td>
            <td><div id="cell6">cell6</div></td>
            <td><div id="cell7">cell7</div></td>
            <td><div id="cell8">cell8</div></td>
            <td><div id="cell9">cell9</div></td>
            <td><div id="cell10">cell10</div></td>
        </tr>
    </table>
</div>

CSS

table tr td {
    border: 1px solid #ACACAC;
    padding: 0 30px;
}

JavaScript

window.scrollTo(document.getElementById("cell4").getBoundingClientRect().left - 30,0);