Using Tables to Do Page Layout

Translate your grid to HTML

Translate to HTML

Jennifer Kyrnin

So, how does this translate into HTML:

<table cellspacing="2" cellpadding="2" border="0">
<tr>
  <td width="200" align="center"> LOGO </td>
  <td align="center"> HEADLINE </td>
</tr>
<tr>
  <td width="200" valign="top"> NAVIGATION </td>
  <td valign="top"> BODY </td>
</tr>
</table>

Index: Using Tables to Do Page Layout

1. The Easy Way to Create Complex Tables for Page Layout
2. Map Out the Design
3. Draw Your Page on the Graph Paper
4. Create a grid of your page elements
5. Examine the structure of your page
6. Translate your grid to HTML
7. Turn on and off the table border