How can I increase space between table data?

Question

I was originally going to upload an image but this isn't possible because I don't have 10 reputation yet. So I will try to describe my problem. At the moment I am using bootstrap to put some styling on a table, however once I do this the table data becomes too close together then what I would prefer it to be. Is there a way to numerically increase the space between table data?

Code is as follows:

#TableTotal{
  font-weight: bold;
  display: block;
}

<table class="table table-striped" id="TableTotal">
  <tr>
    <td>TOTAL PLAN</td>
    <td>£1,200,000.00</td>
  </tr>
  <tr>
    <td>TOTAL ACTUALS</td>
    <td>£1400,090.267</td>
  </tr>
  <tr>
    <td>TOTAL VARIENCE</td>
    <td id="Positive">+£3,990,267.00</td>
  </tr>
</table>

Answer 1

You can add some padding only in the first column

Try:

#TableTotal td:first-child {
    padding-right: 20px; /*Or how much space you need*/
}

#TableTotal {
  font-weight: bold;
  display: block;
}
#TableTotal td:first-child {
  padding-right: 20px; /*Or how much space you need*/
}

<table class="table table-striped" id="TableTotal">
  <tr>
    <td>TOTAL PLAN</td>
    <td>£1,200,000.00</td>
  </tr>
  <tr>
    <td>TOTAL ACTUALS</td>
    <td>£1400,090.267</td>
  </tr>
  <tr>
    <td>TOTAL VARIENCE</td>
    <td id="Positive">+£3,990,267.00</td>
  </tr>
</table>