JSFiddle - React, Tailwind, and code Playground

HTML

<h2>Update the Transaction Details</h2>       
<table>
    <tr>
        <td><h4>Transaction Date:</h4></td>
        <td><input type="text" name="transactiondate" class="tcal" /></td>
    </tr> 
    <tr>
        <td><h4>Category:</h4></td>
        <td>
            <select name="category" id="category">
                <option selected="selected" disabled="disabled"></option>
                <option value="Electricity">Electricity</option>
                <option value="Food">Food</option>                  
                <option value="Others">Others</option>
            </select>
        </td>
    </tr> 
    <tr>
        <td><h4>Amount:</h4></td>
        <td>$<input type="text" name="amount" /></td>
    </tr>
    <tr>
        <td><h4>Mode of Payment:</h4></td>
        <td>
            <input type="radio" name="modeofpayment" value="debit" />
            <h5>Debit</h5>
        </td>
        <td>
            <input type="radio" name="modeofpayment" value="credit" />
            <h5>Credit</h5>
        </td>
    </tr>
    <tr>
        <td><h4>Comments:</h4></td>
        <td><input type="text" name="comments" /></td>
    </tr> 
    <tr>
        <td><input type="submit" name="update" value="Update" /></td>
    </tr>
</table>