Table border spacing samples

Space between cells in the table is provided by the border-spacing property. The border-spacing property is used on the table element and gives the same spacing around each of the cells in the table.

These are html elements and CSS rules you type. Within the style container in the head, or within a separate style sheet file.


      table#sample1
        {
        border:       8px green solid;
        border-spacing: 15px;
        }
      table#sample1 th, table#sample1 td
        {
        border:       2px red solid;
        }

            <table id="sample1">  
              <tr>  
                <th>   Heading 1   </th>  
                <th>   Heading 2   </th>  
              </tr>  
              <tr>  
                <td>   Datum 1   </td>  
                <td>   Datum 2   </td>  
              </tr>  
            </table>  

This is the resulting web page content:


Heading 1 Heading 2
Datum 1 Datum 2