TestBoxSizing

HTML

<table>
  <tr>
    <td class="cell-th2-4"></td>
    <td class="cell-th2-4"></td>
    <td class="cell-th2-3"></td>
  </tr>
</table>
<table>
  <tr>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4 vertical_separator"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4 vertical_separator"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
  </tr>
  <tr>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4 vertical_separator"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
    <td class="cell4 vertical_separator"></td>
    <td class="cell4"></td>
    <td class="cell4"></td>
  </tr>
</table>

CSS

.vertical_separator {
  border-left: 2px solid;
}

.cell-th2-4 {
  min-width: 3.6em;
  text-align: center;
  box-sizing: border-box;
  border-left: 2px solid;
  border-right: 2px solid;
}

.cell-th2-3 {
  min-width: 2.7em;
  text-align: center;
  box-sizing: border-box;
  border-left: 2px solid;
  border-right: 2px solid;
}

.cell4 {
  min-width: 0.9em;
  text-align: center;
  box-sizing: border-box;
}

.cell4:first-child {
  border-left: 2px solid;
}

.cell4:last-child {
  border-right: 2px solid;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  table-layout: fixed;
  box-sizing: border-box;
}

td {
  padding: 0;
  border: 1px solid;
  overflow: hidden;
  box-sizing: border-box;
}

tr {
  white-space: nowrap;
  height: 1.5em;
  box-sizing: border-box;
}