HTML - Tables

TABLES

KEY CONCEPTS:

Rows go from left to right
Columns go from top to bottom
You define the rows first. The number of cells in a row define the number of columns.
You should always indent your table tags or you will get lost.

NEW TAGS:

Start your table with the table tag.

<table

border="#" - defines the size of the border around the table
width="#" - user either pixels or percentages
cellspacing="# " - defines the spacing of the border between the cells
cellpadding="#" - defines the spacing between the cell & the content
bordercolor="#XXXXXX"
>

Create a row with the table row tag.

<tr

width="#"
height="#"
align="left/right/center"
valign="top/middle/bottom"
bgcolor="#XXXXXX"
>

Insert a cell for each column in the table.

<td align="l/c/r" valign="l/c/r" bgcolor="#XXXXXX" height="#" width="#">My content</td>
<td align="l/c/r" valign="l/c/r" bgcolor="#XXXXXX" height="#" width="#">My content</td>
<td align="l/c/r" valign="l/c/r" bgcolor="#XXXXXX" height="#" width="#">My content</td>

Close your table row and table.

</tr>

</table>

EXERCISE: Reformat your three pages using tables to position everything.