JSFiddle - React, Tailwind, and code Playground

by kodjoe mambi

HTML

<table id="fullblock"><tr>

<td class="bloc">1</td>
<td class="emptybloc"></td>
<td class="bloc">2</td>

</tr></table>

CSS

* {padding:0; margin:0; } 
body, html { width:100%; height:100% } 




table#fullblock { text-align:left; padding:0px;}

.bloc { width:140px; height:40px; border:1px solid #ccc; }

.emptybloc { width:20px; height:0px; }


@media (max-width: 300px)   { 
   

.bloc, .emptybloc { display:inline-block; width:140px; height:040px; margin: 0 auto 20px auto; text-align:center; border:1px solid #ccc}
    
.emptybloc { width:0px; height:0px; border:0px; }
    
table#fullblock { text-align:center; margin:margin:0 auto;}
}