JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<table id="tableDataInp" cellpadding="0" cellspacing="0">
  <tr>
    <td><input type="text" value="" /></td>
    <td><input type="text" value="" /></td>
  </tr>
  <tr>
    <td><input type="text" value="" /></td>
    <td><input type="text" value="" /></td>
  </tr>
</table>

CSS

*{
  box-sizing
}
#tableDataInp{
  border:0;
}
#tableDataInp tr:after{
  content:"%";
  color:#fff;
  width:20px;
  vertical-align:middle;
  height:20px;
  border-radius:5px;
  background:red;
  padding:3px;
  
}
#tableDataInp tr td{
  border:1px solid #000;
  padding:5px;
}