TABLE Data Display 4

Displaying your data in your table

Row 1 duck Cell 3 duck Cell 5
Row 2 duck Cell 4
Row 3
spacer 2

TABLE Data Display - Cellpadding

The following examples show you what your table will look like when you use the "cellpadding" attribute in your table.  Cellpadding is not available for the <tr>, <th> or <td> elements.

Example 1 Using Cellpadding for more spacing in the Table

<tr>
  <td align="center">
    <table width="500" bgcolor="#FFFF00" border="7" style="border-color:#900" cellpadding="0">
      <tr class="trtext1">
        <th width="60%" bgcolor="#99FF99" align="center">File Name</th>
        <th width="40%" align="center">Submitter</th>
      </tr>
      <tr bgcolor="#FFFF99">
        <td bgcolor="#FF6699" align="left">File for research purposes</td>
        <td align="center">Bryant Walker</td>
      </tr>
    </table>
  </td>
</tr>
File Name Submitter
File for research purposes Bryant Walker

This example shows color added to two cells; cell 1 of the header row 1 and cell 2 of the second row.  It is also an example of no "cellpadding" in the table.

Example 2 No color and cellpadding is added to the table.

<tr>
  <td width="300" align="center">
    <table border="7" style="border-color:#900" cellpadding="35">
      <tr>
        <th width="60%" align="center">File Name</th>
        <th width="40%" align="center">Submitter</th>
      </tr>
      <tr>
        <td align="left">File for research purposes</td>
        <td align="center">Bryant Walker</td>
      </tr>
    </table>
  </td>
</tr>
File Name Submitter
File for research purposes Bryant Walker

The table in the second example has a background color because the simulated page was given a background color.  Otherwise, it would not have a color.  Cellpadding (35px) was added to the table to demonstrate what it looks like with a large amount of cellpadding pixels for spacing inside the cells.  This exagerated example gives you some idea of what cellpadding does to the table.

Notice that the text in cell 1 of row 2 is centered on the page even though we had designated the "align" attribute to be "left" for the text.  This is a result of the exagerated amount of pixels in "cellpadding" for the table.  If we increase the pixels in the "cellpadding" attribute, the text will be squeezed even more and would probably wrap around to be two lines instead of one.

CLICK FOR PAGE 5 on Cellspacing in Tables


Previous Page Next Page