JSFiddle - React, Tailwind, and code Playground

by bigthyme

HTML

<table id="foo" class="one">
<tr>
     <td>One</td>
  </tr>
  <tr>
     <td>Two</td>
  </tr>
  <tr>
     <td>Three</td>
</tr>
</table>

CSS

#foo{
    position: absolute;
    display: block;
    background: gray;
    color: white;
    height: 67px;
    width: 500px;
    border: 1px solid black;
}

tr {
     width: 500px;
     border: 1px solid black;
}


.one td {
    background: red;
    display: block;
    position: relative;
    left: 0px;
    width: 15px;
    border: 1px solid black;
    height: 19px;
    text-indent: 22px;
}

.two td {
    background: green;
    display: block;
    position: relative;
    left: 0px;
    width: 15px;
    border: 1px solid black;
    height: 19px;
    text-indent: 22px;
}

.three td {
    background: blue;
    display: block;
    position: relative;
    left: 0px;
    width: 15px;
    border: 1px solid black;
    height: 19px;
    text-indent: 22px;
}