title besides title

 

Wednesday, December 12, 2012

CSS : Tables - [6.1] Setting the Cell Spacing

Problem

You want to change the space between the table border and cell borders.

Solution

Use the cellspacing table attribute:
<table cellspacing="15">

 <tr>

   <th colspan="2">

    General Demographic Characteristics of Tallahassee, FL

   </th>

 </tr>

 <tr>

   <th>

   </th>

   <th>

    Estimate

   </th>

 </tr>

 <tr>

   <td>

    Total population

   </td>

   <td>

    272,091

   </td>

 </tr>

</table>

Discussion

The CSS 2.1 specification describes a standard mechanism to manipulate the cellspacing table attribute through the use of the border-spacing property when the border-collapse value is set to separate:
border-collapse: separate; 

border-spacing: 15px;

However, implementation of this part of the specification isn't visible in Internet Explorer for Windows. (It does work in Netscape Navigator 7+.) Using the cellspacing attribute is currently the best solution that works in Internet Explorer for Windows, Netscape Navigator, Safari, and Opera browsers.