I am facing an issue with a nested table where I need to remove the borders from specific cells (around A and B). Here is the code snippet:
<style>
.withBorders tr td{
border: 1px solid black !important ;
}
.withBorders table.withoutBorders tr td {
border:0px
}
</style>
<table class="withBorders">
<tr>
<td>
<table class="withoutBorders">
<tbody>
<tr>
<td>A</td>
<td>B</td>
</tr>
</tbody>
</table>
</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
</tr>
</table>
Despite trying various CSS changes for the child table, I am unable to override the parent table's properties. Any advice on how to solve this issue would be greatly appreciated.
Please note that modifications cannot be made to the parent table's CSS selector.