JSFiddle - React, Tailwind, and code Playground

by vakshu

HTML

<table class="tabHeight">
    <tr><td class="tdwidth">hey1 </td><td class="tdwidth">hey1 </td></tr>    
    <tr><td class="tdwidth">hey2 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey3 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey4 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey5 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey6 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey7 </td><td class="tdwidth">hey1 </td></tr> 
</table>


<table class="tabHeight1">
    <tr><td class="tdwidth">hey1 </td><td class="tdwidth">hey1 </td></tr>    
    <tr><td class="tdwidth">hey2 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey3 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey4 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey5 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey6 </td><td class="tdwidth">hey1 </td></tr> 
    <tr><td class="tdwidth">hey7 </td><td class="tdwidth">hey1 </td></tr> 
</table>

CSS

.tabHeight{max-height:100px;width:100%;overflow-y:auto;padding:2px;color:orange;border: 2px solid black;}
.tdwidth{width:50%}


.tabHeight1{max-height:100px;width:100%;overflow-y:auto;padding:2px;color:blue;border: 2px solid black;display:block;}
.tdwidth{width:50%}