JSFiddle - React, Tailwind, and code Playground

HTML

<table style="width: 300px;">
      <tr>
          <td>
               <div  class="progress-full" >
                   ...
               </div>
          </td>
      </tr>
      <tr>
          <td >
                <div class="progress-quarter" >
                    ...
                </div>
          </td>
      </tr>
</table>

CSS

table
{
    border:1px Solid #CCC;
}
table tr td
{
 width:300px;   
    border:1px solid #CCC;
}

.progress-full
{
    width:100%;
    background-color: rgb(128, 177, 133);
}
.progress-half
{
    width:50%;
    background-color: rgb(128, 177, 133);
}
.progress-quarter
{
    width:25%;
    background-color: rgb(128, 177, 133);
}