Tableless Design Example Code

The HTML Code:

<body>

<div id="container">

<div id="nav"><p><strong>Navigation</strong><br /><br />
<a href="">link #1</a><br />
<a href="">link #2</a><br />
<a href="">link #3</a><br />
</p>
</div>

<div id="header"><p>This is the header of your webpage. Logos go here as well as any other essential info you want. Generally
it's a good idea to keep this the same on every page.</p></div>

<div id="main">

<div id="content">This is the main content area where all of your page content will go.</div>

</div>

<div id="footer"><p>Footers are primarily for copyright information.</p></div>

</div>



<div id="container2">

<div id="header2" class="layerstyle"><p>This is the header of your webpage. Logos go here as well as any other essential info you want. Generally it's a good idea to keep this the same on every page.</p>

<div id="nav2" class="layerstyle"><a href="">link #1</a> | <a href="">link #2</a> | <a href="">link #3</a></div>
</div>

<div id="main_content2" class="layerstyle">This is the main content area where all of your page content will go.</div>

<div id="footer2" class="layerstyle"><p>Footers are primarily for copyright information.</p></div>

</div>



<div id="container3">

<div id="header3" class="layerstyle2"><p>This is the header of your webpage. Logos go here as well as any other essential info you want. Generally it's a good idea to keep this the same on every page.</p></div>

<div id="nav3"><a href="">link #1</a> | <a href="">link #2</a> | <a href="">link #3</a></div>

<div id="main_content3">
<div id="left">left</div>

<div id="center">center</div>

<div id="right">right</div>
</div>

<div id="footer3"><p class="layerstyle2">Footers are primarily for copyright information.</p></div>

</div>

</body>
</html>