Site Design

Page 3

Nesting Tables

Starting a web page with Notepad:

One of the most widely used methods for structuring website content is tables. If you're serious about how to fine-tune your site, you already know that there are lots of cool things you can do with tables to present your site's information the way you want it to appear.

Sooner or later, you'll realize that nesting tables is a must to create the effect you want. As with all HTML tags, nesting means you place tags within other tags in order, just like a bold tag follows a font tag, tables can be nested within other tables.

With a little practice and perseverance, you'll soon see that tables can do just about anything, and they're safer than frames, which can trap users in miniature windows or cause other problems. To nest a table, you simply place one inside another. A good example is a left-hand navigation bar. Links appear in this table, while site content is placed in the right table.

Consider this example:
<table border=1>
<tr>
<td>
<table border=1>
<tr>
<td>Left Side Contents</td>
</tr>
</table>
</td>
<td>Right Side Contents</td>
</tr>
</table>

Left Side Contents

Right Side Contents

ADDING PAGE MARGINS:

Like everything else you can do with your site, adding page or partial margins to your site can be done in a number of ways. The easiest way, which works with IE only, is to add margin attributes to your BODY tag in pixels. If you want your page to begin at a certain depth from the top and left, you simply add these attributes like this: 
<BODY topmargin="0" leftmargin="0" marginwidth="0" marginheight="0"> 
This will remove all margins from your page, flush to the top and flush left.

Another method of moving a margin for a section of the page is to use a List Tag to offset text from the left by containing text within <UL></UL> tag, or you could use the <BLOCKQUOTE> tag.

A third method of controlling margins is by using tables with empty table cells.
<table border=1>
<tr>
<td> &nbsp; &nbsp; </td>
<td>Contents pushed right</td>
</tr>
</table>

Remember, empty tables can be nested, (see above) with attributed heights and widths to create margins. Experiment with these methods to achieve your results. The more you do this, the better you'll get.

Again, I actually recommend using Mircosoft Frontpage for designing any web site because you don't need to know html in order to build.


[ Site Design 1 | Site Design 2 | Site Design 3 | Site Design 4 | Site Design 5 | Site Design 6 ]

  

[ About Me | Site Legal Info | Site Design | CSS Coding ]
[ JavaScripts | Hints & Tips | BackGrounds | Misc. Images ]
[ Templates | Logo Page | Special Characters | Color Chart ]
[ Contact Us! | Awards Won | Links ]
[ Home | Site Map ]

  

Go to Top


Webmaster & Owner: Anita Eberline
No part may be reproduced without prior permission by Anita Eberline