JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr class="first-line"><td>A</td><td>B</td></tr>
    <tr class="last-line"><td>C</td><td>D</td></tr>
</table>

CSS

table {
    border-collapse: separate;
    border-spacing: 0;
}
table, td {
    border: 1px solid black;
    padding: 5px;
}

table .first-line > td:first-child {
    border: solid black;
    border-width:1px 0px 0px 1px;
    border-radius: 5px 0px 0px 0px;
    padding: 5px;
}

table .first-line > td:last-child {
    border: solid black;
    border-radius: 0px 5px 0px 0px;
    border-width:1px 1px 0px 1px;
    padding: 5px;
}

table .last-line > td:first-child {
    border: solid black;
    border-width:1px 0px 1px 1px;
    border-radius: 0px 0px 0px 5px;
    padding: 5px;
}

table .last-line > td:last-child {
    border: 1px solid black;
    border-radius: 0px 0px 5px 0px;
    padding: 5px;
}