Table after Table Technique is applied
Page Header

 

 

Body Content

Product 1
Product 2
Product 3
Product 4
Product 5

Page Footer


Page Source Code
"View Source" below to see where to insert the "empty data set" <td></td>.
You will notice that the nav bar has moved to the bottom of the source, next to the footer.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Table based page with implementation of the "Table Technique"</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<font size="2" face="Verdana, Arial, Helvetica, sans-serif"><strong>Table after Table Technique is applied.</strong></font>

<table width="100%" >
<!-- This is my masthead -->
<tr align="center" valign="top">
<td colspan="2">

<!-- Start Header -->
<table width="100%" border="1" align="center" >
<tr>
<td align="center" valign="top"><div align="center"><font size="2" face="Verdana, Arial, Helvetica, sans-serif">Page Header</font></div></td>
</tr>
</table>
<!-- end header -->

</td>
</tr>
<!-- end masthead -->

<!-- start table technique...
it only consists of one <td>&nbsp;</td> inside the same <tr> as the table technique and body copy -->
<tr>
<!-- opening <tr> for body and table technique -->
<td align="left" valign="top">&nbsp;</td>
<!-- end table technique -->

<!-- start body content -->
<td width="100%" height="100%" rowspan="2" align="left" valign="top">

<!-- start of body -->
<!-- DEPENDING ON WHICH PAGE YOU'RE LOOKING AT, YOU SHOULD NOTICE THE LOCATION<br>
OF THE BODY. IS IT NEAR THE TOP OF THE CODE OR NEAR THE BOTTOM? -->

<table width="100%" height="100%" border="1" align="left" >
<tr>
<td align="center" valign="top"><div align="center">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><font size="3" face="Verdana, Arial, Helvetica, sans-serif"><strong>Body Content</strong></font></p>
</div></td>
</tr>
</table>
<!-- end body content -->

</td>
</tr><!-- closing </tr> -->
<!-- end body content and table technique -->

<!-- nav starts here -->
<tr>
<td align="left" valign="top">

<!-- Start Left Nav -->
<!-- DEPENDING ON WHICH PAGE YOU'RE LOOKING AT, YOU SHOULD NOTICE THE LOCATION<br>
OF THE NAV. IS IT NEAR THE TOP OF THE CODE OR NEAR THE BOTTOM? -->

<table width="100%" height="100%" border="1" align="left" >
<tr>
<td align="left" valign="top"><p align="left">
<font size="2" face="Verdana, Arial, Helvetica, sans-serif">
Product 1<br>
Product 2<br>
Product 3<br>
Product 4<br>
Product 5</font>
</td>
</tr>
</table>
<!-- end left nav -->

</td>
</tr>
</table>

<!-- Start Footer -->
<table width="100%" border="1" align="center" >
<tr>
<td align="center" valign="top"><div align="center"><font size="2" face="Verdana, Arial, Helvetica, sans-serif">Page Footer</font></div></td>
</tr>
</table>
<!-- end footer -->
</body>
</html>