JSFiddle - React, Tailwind, and code Playground

by Ayyappan Sakthivadivel

HTML

<table class="table">
 <thead>
    <tr>
    <th>Judul1</th>
    <th>Judul2</th>
    <th>Judul3</th>
    <th>Judul4</th>
    </tr>
 </thead>
 <tbody>
  <tr>
   <td colspan="4">
    <div class="table-wrap" >
    <table class="table-dalam">
  <tbody>
  <?php foreach(range(1,10) as $i): ?>
   <tr >
   <td class="td-nya">td1 </td>
   <td class="td-nya">td2</td>
   <td class="td-nya">td2</td>
   <td class="td-nya">td2</td>
   </tr>
  <?php endforeach;?>
   
  </tbody>
    </table>
    </div>
   </td>
  </tr>
 </tbody>
</table>

CSS

.table{width: 500px;height: 200px;border-collapse:collapse;}
.table-wrap{width:100%;overflow-y:auto;overflow-x:hidden;}
.table-dalam{width:500px;border-collapse:collapse;}
.td-nya{border-left:1px solid white;border-right:1px solid grey;border-bottom:1px solid grey;}