Details

Using Tables

1	Details
2	Examples
3	Resources
4	Step-by-Step

1 2 3

Using Tables - Details

Table Terms:

Let’s take a look at the elements of a table, and preview some HTML terms we will be using.

Note: Many web authoring / web editors make it easy to create and layout your tables. See Using a Web Editor.

Table element	Tag example:	Notes:
Table	`<table>`	you can have `<table width=600 align="centre">`
Row	`<tr>`	`<tr>` means start a new row
Column	`<td>`	`<td>` means start a new column (within a row)
Cell		the intersection of a row and a column
Border	`border="1"`	you can have `<table width=600 border="2">`

Warning: A table will not show on your page until it is fully loaded. Thus your visitor may have to look at a blank screen if your whole page content is within a table. Minimise any delay by using a number of tables in combination instead of one large one.

Tip: Setting a table width to 100% ensures that your table uses the whole screen, no matter what the browser resolution. This will suit simple pages where layout of your elements can afford to be flexible. It may not, however, suit many complex pages.

Tip: Complex layout (e.g. a menu, title graphic, text boxes, side-columns etc.) which needs to be consistent should be done inside a table of width around 590 pixels. This maximises your chances of layout consistency, although much space can be "left over" in the case of viewers using larger screen-resolutions.