JSFiddle - React, Tailwind, and code Playground

HTML

<div><table>
    <tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2 Lorem Ipsum is simply dummy text of the printing and typesetting industry.s</td>
            <td class="long">Column 3 Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
            <td class="long">Column 4 Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
        </tr><tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2 Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
            <td class="long">Column 3 Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
            <td class="long">Column 4 Lorem Ipsum is simply dummy text of the printing and typesetting industry.</td>
        </tr>
        <tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td class="long">Column 4</td>
        </tr>
        <tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td class="long">Column 4</td>
        </tr><tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td class="long">Column 4</td>
        </tr><tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td class="long">Column 4</td>
        </tr><tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td class="long">Column 4</td>
        </tr><tr>
            <td class="headcol">Column 1</td>
            <td class="long">Column 2</td>
            <td class="long">Column 3</td>
            <td...

CSS

body { font:normal 14px Arial; padding:10px}
        table { border-collapse:separate; border-top: 1px solid grey; }
        td {
            margin:0;
            border:1px solid grey; 
            border-top-width:0px; 
            border-right-width:0px; 
            white-space:nowrap;
        }
        div { 
            width: 600px; 
            height: 200px;
            overflow-x:auto;  
            overflow-y:visible;
            padding-bottom:1px;
            margin-left:50px;
        }
        .headcol {
            position:absolute; 
            background: white;
            border-top-width:1px; /*only relevant for first row*/
            border-right-width:1px; 
            margin-top:-1px; /*compensate for top border*/
            }
        td { padding: 5px; }