remove empty td paddings

by Eric Miller

HTML

<table cellpadding="0" cellspacing="0">
  <tr>
    <td>foo</td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td>bar</td>
  </tr>
</table>

SCSS

tr {
  td {
    padding: 4px;
    background-color: red;
    border: 1px solid blue;
    &:empty {
      padding: 0;
      background: yellow;
      border-width: 0;
      &:first-child{
        border-left-width:1px;
      }
      &:last-child{
        border-right-width:1px;
      }
    }
  }
  &:first-child {
    td:empty {
      border-top-width: 1px;
    }
  }
  &:last-child {
    td:empty {
      border-bottom-width: 1px;
    }
  }
}