JSFiddle - React, Tailwind, and code Playground

HTML

<div class=wrapper-outer>
<div class="wrapper">
    <div class="table">
        <div class="tr">
            <div class="th fixed">Fixed 1</div>
            <div class="th">Lorem ipsum dolor</div>
            <div class="th">Ipsum</div>
            <div class="th">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 1</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 2</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 3</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 4</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 5</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 6</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 6</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div class="td fixed">Fixed 6</div>
            <div class="td">Lorem</div>
            <div class="td">Ipsum</div>
            <div class="td">Sator</div>
        </div>
        <div class="tr">
            <div...

CSS

.table 
{
  border-collapse:collapse;
  border: 1px solid grey; 
  display: table;
}

.tr
{
  display: table-row;
}

.th
{
  display: table-cell;
  border:1px solid grey;   
  white-space:nowrap;
  font-weight: bold;
}

.td 
{
  display: table-cell;
  border:1px solid grey;   
  white-space:nowrap;
  margin:0;
}

.wrapper 
{ 
  overflow-x:scroll;  
  margin-left:100px; 
  overflow-y:visible;  
}

.wrapper-outer
{ 
  position: relative;
  width: 300px;
}

.fixed {
  position:absolute; 
  width:100px; 
  left:0;
  top:auto;
}       

.th.fixed{
  top: 0;
}