Cell spacing and cell padding

In addition to amending the border size, it’s possible to change the amount of padding
within a table’s cells, as well as the spacing between all the cells in a table. This is done with
the cellpadding and cellspacing attributes, respectively. In the rather extreme example
that follows, cellpadding is set to 20, cellspacing to 40, and border to 5, so that each
can be differentiated with ease (see the subsequent screenshot). As you can see,
cellspacing not only affects the spacing between the cells, but also the distance between the cells and the table’s edges. (The CSS property border-spacing is intended to do the
same thing as cellspacing, but Internet Explorer to version 7 doesn’t support it.)
<table cellpadding="20" cellspacing="40" border="5">
<tr><td>Cell one</td><td>Cell two</td></tr>
<tr><td>Cell three</td><td>Cell four</td></tr>
</table>
You might be thinking that design-wise, this example sucks, and you’d be right. The chunko-
vision 3D border isn’t particularly tasteful. However, you can omit the border attribute
and use CSS to style borders instead—see the “Styling a table” section later on in this
chapter. That section also details how to set padding in CSS, which provides you with sitewide
control over cell padding. CSS also gives you much finer control over the individual
elements in a table—whereas the inline HTML attributes impose a one-style-fits-all
straightjacket.