JSFiddle - React, Tailwind, and code Playground
by Lijo
HTML
<div>
<br/>
<input type="submit" value="Hide Associate" />
<input type="submit" value="Show Associate" />
<br/>
<table class="resultGridTable" cellspacing="0" id="detailContentPlaceholder_grdTransactions"
style="border-collapse: collapse;">
<tr>
<th scope="col">
</th>
<th colspan='4' class='tableColGroupAssociate'>
Associate Info
</th>
<th colspan='5' class='tableColGroupTransaction'>
Financial Info
</th>
</tr>
<tr class=''>
<th>
Line #
</th>
<th scope="col">
EmpID
</th>
<th scope="col">
SID
</th>
<th scope="col">
First Name
</th>
<th scope="col">
Last Name
</th>
<th scope="col">
Type
</th>
<th scope="col">
App ID
</th>
<th scope="col">
Batch ID
</th>
<th scope="col">
Correlation ID
</th>
<th scope="col">
Transaction ID
</th>
</tr>
<tr>
<td>
1
</td>
<td>
123
</td>
<td>
1234
</td>
<td>
Sandy
</td>
<td>
Taylor
</td>
<td>
P Adj
</td>
<td>
1
</td>
<td>
<a id="detailContentPlaceholder_grdTransactions_HyperLink1_0" onclick="setBatchTransactionValue();">
1</a>
</td>
<td>
1
</td>
...
CSS
td
{
margin: 0 10px 0 10px;
border: 1px solid blue;
}
th
{
margin: 0 10px 0 10px;
border: 1px solid blue;
font: bold 12pt Arail;
}