JSFiddle - React, Tailwind, and code Playground
by Norelys Rumbos
HTML
<div class="box-body">
<table id="transactional-channels" class="table table-striped table-bordered">
<thead>
<tr>
<th>Canales / Transacciones</th>
<th>Pagos de clientes</th>
<th>Entregas a clientes</th>
<th>Gariantías, Quejas e Información a clientes</th>
<th>Ventas</th>
<th>Otras Transacciones</th>
</tr>
</thead>
<tbody>
<tr>
<td>Web</td>
<td>
<input id="transactional_channel_payment_web" class="form-control field_percentage" type="number" name="transactional_channel[payment][web]" max="100" min="0" step="0.01" value="1110">
</td>
<td>
<input id="transactional_channel_delivery_web" class="form-control field_percentage" type="number" name="transactional_channel[delivery][web]" max="100" min="0" step="0.01" value="">
</td>
<td>
<input id="transactional_channel_information_web" class="form-control field_percentage" type="number" name="transactional_channel[information][web]" max="100" min="0" step="0.01" value="">
</td>
<td>
<input id="transactional_channel_sales_web" class="form-control field_percentage" type="number" name="transactional_channel[sales][web]" max="100" min="0" step="0.01" value="">
</td>
<td>
<input id="transactional_channel_other_web" class="form-control field_percentage" type="number" name="transactional_channel[other][web]" max="100" min="0" step="0.01" value="">
</td>
</tr>
<tr>
<td>Móvil</td>
<td>
<input id="transactional_channel_payment_mobile" class="form-control field_percentage" type="number" name="transactional_channel[payment][mobile]" max="100" min="0" step="0.01" value="">
</td>
<td>
<input id="transactional_channel_delivery_mobile" class="form-control field_percentage" type="number" name="transactional_channel[delivery][mobile]" max="100" min="0"...