html - css background-color が td の幅をインクリメントする理由

Question

次のような html 構造体:

<table class="barby-barcode">
  <tbody>
    <tr class="barby-row">
      <td class="barby-cell on"></td>
      <td class="barby-cell on"></td>
      <td class="barby-cell on"></td>
    </tr>
  </tbody>
</table>

次のようなcss：

table.barby-barcode { border-spacing: 0; }
tr.barby-row { height: 100px; }
td.barby-cell { width: 3px; height: 3px; }
td.barby-cell.on { background: #000; }

しかし、実際に表示されるのは、td.barby-cell.on の幅が 5px であることです。