Unclosed lateral HTML table border

Question

Is it possible to have the side borders of HTML tables like this:

A vertical line that is not connected to the top and bottom of the table.

Answer 1

.table {
  background-color: #272727;
  width: 100%;
  text-align: left;
  border-collapse: collapse;
}

.table__body-row {
  height: 41px;
  border-bottom: 1px solid #000000;
}

.table__body-row.filled {
  background: #191919;
}

.table__body-cell {
  font-size: 14px;
  color: #FFFFFF;
  border: none;
}

.table__header {
  background: #000000;
}

.table__header-row {
  height: 40px;
}

.table__header-cell {
  font-size: 12px;
  font-weight: 400;
  color: #FFFFFF;
  text-align: left;
  padding: 0 16px 0 16px;
}

.table__cell-body {
  border-right: 1px solid #000000;
  padding: 0 10px 0 10px;
  min-height: 17px;
}

.table__body-cell:last-of-type .table__cell-body {
  border-right: none;
}

<table class="table">
  <thead class="table__header">
    <tr class="table__header-row">
      <th class="table__header-cell">
        Header 1
      </th>
      <th class="table__header-cell">
        Header 2
      </th>
    </tr>
  </thead>
  <tbody id="tableBody">
    <tr class="table__body-row">
      <td class="table__body-cell">
        <div class="table__cell-body"></div>
      </td>
      <td class="table__body-cell">
        <div class="table__cell-body"></div>
      </td>
    </tr>
  </tbody>

</table>

This can be done using a nested div with a border. Please see snippet.