Tables

Tables are a powerful tool in HTML. Because the language does not accommodate a lot of page layout, tables are often used for formatting a page. For example, the margins on this page are created by using tables. It is important to remember, however, that not all browsers know how to display tables so it is never a good idea to have your page dependent on them. Your page should always look good even without tables. You can add a table to your web page by using the <TABLE> tags.

The <TABLE></TABLE> tags open and close a table.
The <TR></TR> tags open and close a row.
The <TD></TD> tags open and close a cell or square in the table.
The <TH></TH> tags are also cell tags but are used as headers and are bold.
Tables are developed one row at a time. Open a row, include all of the cell tags for that row, close that row and then move on to the next row.

The opening <TABLE> tag can take a number of attributes. The most important one is the WIDTH attribute. Its value can be in pixels or percentages. In most cases, you want the value to be a percentage so that if the user resizes their browser window the table also changes accordingly. The CELLSPACING attribute refers to the space between cells and should be in pixels. The CELLPADDING attribute refers to the spacing within the cell in pixels (the space between the cell walls and the contents of the cell). The BORDER attribute refers to the size of the outside border of the table. It also should be in pixels. If you do not want the border on your table to be visible (ex. If you are using your table for formatting reasons) set BORDER to 0.

<TABLE WIDTH="100%" CELLSPACING="5" CELLPADDING="5" BORDER="5">
<TR>
<TH>
This is a square in my table
</TH>
<TH>
This is a square in my table.
</TH>
</TR>
<TR>
<TD>
This is a square in my table.
</TD>
<TD>
This is a square in my table.
</TD>
</TR>
</TABLE>