Today we'll talk about cellpadding and cellspacing. They are attributes in the table tag.
First, we want the table to stand out from our page, so add a bgcolor to your table tag if you don't have one already. This bgcolor should be different from your page or sig bgcolor. I'll use bgcolor="#9999ff", a light blue.
We also want to see the edge of our cell, so set border="1". Your table structure should look something like this:
<table bgcolor="#9999ff" cellpadding="0" cellspacing="0" border="1" align="center">
<tr>
<td>
content
</td>
<td>
content
</td>
</tr></table>
|
|
|
|
|
|
Cellpadding is space that you add around the contents of your cell. This space is inside the cell.
Think of a table cell as a box. Imagine that your image (or other cell content) is a precious object. You are going to ship it somewhere and you want to protect it. So you pad it, like you would with bubble wrap.
cellpadding="15", cellspacing="0"|
|
Cellspacing is space between cells. If we have more than one cell (little box), we might not want them to butt against each other. We want to space them apart, like wrapping styrofoam outside of the box (cell) that contains my precious item. Set cellpadding="0" and choose a cellspacing amount.
cellpadding="0" cellspacing="15"|
|
Notice that my image is not padded - it is snug againt the cell walls.
Now we'll use cellpadding (inside the cell) and cellspacing (outside the cell) together.
cellpadding="15" cellspacing="15"|
|
|
|
|
|
Notice that there is space around my unity ribbons (they are "protected") inside the cells and that the cells are spaced apart.
Finally, I'll increase my border to wrap everything up in a nice package.
cellpadding="15" cellspacing="15" border="15"|
|
|
|
Play around with various cellpaddingand cellspacing settings and see what you get. Post a table you like.
As always, questions and comments are welcome.
Happy tabling,
Gnubee