highlight a group of TD

HTML

<table>
  <tr>
    <td>lorem</td>
    <td>ipsum</td>
    <td>dolor</td>
    <td>sit</td>
    <td>amet</td>
    <td>consectetur</td>
  <tr>

  <tr>
    <td class="outline left">adipiscing</td>
    <td class="outline middle-horizontal">elit</td>
    <td class="outline right">Quisque</td>
    <td>nulla</td>
    <td>massa</td>
    <td>vestibulum</td>
  <tr>
</table>

CSS

body {
  padding: 20px;
  font-size: 1.5rem;
}

table,
td {
  border: 1px solid #000;
  padding: 4px;
}

td {
  position: relative;
}

td.outline {
  font-size: 2.5rem;
}

td.outline:after {
  content: '';
  position: absolute;
  top: -5px;
  left: -5px;
  bottom: -5px;
  right: -5px;
  border-color: red;
  border-style: solid;  
}

td.outline.left:after {
  border-width: 6px 0 6px 6px;
}

td.outline.middle-horizontal:after {
  border-width: 6px 0 6px 0;
}

td.outline.right:after {
  border-width: 6px 6px 6px 0;
}