htmlcsshtml-tablecellspacing

How to set cellspacing in tables only horizontally

I would like to style the table written below.

<table border="1"   cellspacing="10">
  <tr>
    <th>Month</th>
    <th>Savings</th>  
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

The problem is that cellspacing sets the space between cells both horizontaly and verticaly, I would like it to be done only horizontaly. Is there a way to do this.

Solution

  • Use the border-spacing CSS property on the table. Browser support is fairly good (excluding mainly IE up to and including IE 7). Example:

    table { border-spacing: 10px 0; }