JSFiddle - React, Tailwind, and code Playground
HTML
<table border="0" cellpadding="2" cellspacing="0">
<tr>
<td class="variableContent">
Variable height content
</td>
<td>
<table>
<tr>
<td class="checkbox"><input type="checkbox" name="baba" value="checkbox" /></td>
<td>Row 1a</td>
<td>(OC)</td>
<td>John</td>
</tr>
<tr>
<td class="checkbox"><input type="checkbox" name="baba" value="checkbox" /></td>
<td>Row 1b</td>
<td>(OC)</td>
<td>Mary</td>
</tr>
<tr>
<td colspan="4">This is where comment goes</td>
</tr>
<tr>
<td class="checkbox"><input type="checkbox" name="baba" value="checkbox" /></td>
<td>Row 1c</td>
<td>(OC)</td>
<td>Larry</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="variableContent">
Variable height content <br />
Variable height content <br />
Variable height content
</td>
<td>
<table>
<tr>
<td class="checkbox"><input type="checkbox" name="baba" value="checkbox" /></td>
<td>Row 2a</td>
<td>(OC)</td>
<td>Jen</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="variableContent">
Variable height content
</td>
<td>
<table>
<tr>
<td class="checkbox"><input type="checkbox" name="baba" value="checkbox" /></td>
<td>Row 3a</td>
<td>(OC)</td>
<td>George</td>
</tr>
<tr>
...
CSS
table {background:#e3e3e3;}
td {vertical-align:top; border-bottom:1px solid #999;}
td td {width:100px; border-bottom:none;}
td.checkbox {width:20px;}
.variableContent {background:#f00;}