JSFiddle - React, Tailwind, and code Playground

by agib

HTML

<table>
    <tr class="test-row">
        <td>Name1</td>
        <td class="test-cell">
            <input type="text" value='test1' />
        </td>
    </tr>
    <tr class="test-row">
        <td><h1>Test</h1></td>
        <td class="test-cell">
            <input type="text" value='test2test2' />
        </td>
    </tr>
</table>

CSS

table {
    border-collapse:collapse;
    position:absolute;
}
td {
    border: 1px Solid gray;
    /*height: 120px;*/
    position: relative;
    width: 100px;
}
.test-row {
    background-color: red;
}
.test-cell div, .test-cell input {
    display: block;
    /* position: absolute; Don't use this style */
    height:100%;
    width: 100%;
    text-align: center;
    /* Don't need these, because it goes along with position absolute
         top:0;
         left:0;
         bottom:0;
         right:0;
      */
    background-color: green;
    width:100%;
}