H T M L    
       

T
  		A B L E S
      and

L
 		 A Y O U T



a very simple 2X2 table:

cell 1 cell 2
cell 3 cell 4 

<TABLE BORDER>
<TR> 
	<TD>cell 1</TD> 
	<TD>cell 2</TD>  
</TR>
<TR> 
	<TD>cell 3</TD> 
	<TD>cell 4</TD>  
</TR>
</TABLE>

a 3X3 table:

one two three
four five six
seven eight nine 

<TABLE BORDER>
<TR>  
	<TD>one</TD> 
	<TD>two</TD> 
	<TD>three</TD>  
</TR>
<TR>  
	<TD>four</TD> 
	<TD>five</TD> 
	<TD>six</TD>  
</TR>
<TR>  
	<TD>seven</TD> 
	<TD>eight</TD> 
	<TD>nine</TD>  
</TR>
</TABLE>


using the rowspan tag:

item #1item #2item #3
item #4 item #5

<TABLE BORDER>
<TR>
  <TD>item #1</TD>
  <TD ROWSPAN=2>item #2</TD>
  <TD>item #3</TD>
</TR>
<TR>
  <TD>item #4</TD> 
  <TD>item #5</TD>
</TR>
</TABLE>

one two three four
five six seven 

<TABLE BORDER>
<TR>
   <TD ROWSPAN=2>one</TD>
   <TD>two</TD> <TD>three</TD> <TD>four</TD>
</TR>
<TR>
   <TD>five</TD> <TD>six</TD> <TD>seven</TD>
</TR>
</TABLE>
using the colspan tag

one two
1a 1b 2a2b
1c 1d 2c2d 
<TABLE BORDER>
<TR>
   <TD COLSPAN=2>one</TD>
   <TD COLSPAN=2>two</TD>
</TR>
<TR>
   <TD>1a</TD> <TD>1b</TD> <TD>2a</TD> <TD>2a</TD>
</TR>
<TR>
   <TD>1c</TD> <TD>1d</TD> <TD>2c</TD> <TD>2d</TD>
</TR>
</TABLE>


headers

HEADING 1 HEADING 2
1a 1b 2a2b
1c 1d 2c2d 
<TABLE BORDER>
<TR>
   <TH COLSPAN=2>HEADING 1</TD>
   <TH COLSPAN=2>HEADING 2</TD>
</TR>
<TR>
   <TD>1a</TD> <TD>1b</TD> <TD>2a</TD> <TD>2a</TD>
</TR>
<TR>
   <TD>1c</TD> <TD>1d</TD> <TD>2c</TD> <TD>2d</TD>
</TR>
</TABLE>


table borders, cellspacing and cellpadding

default borders:
<TABLE BORDER>
cell 1 cell 2
cell 3 cell 4


same table without borders - (omit "border" tag altogether):
<TABLE>
cell 1 cell 2
cell 3 cell 4


a thin border
<TABLE BORDER=1 CELLSPACING=0>
cell 1 cell 2
cell 3 cell 4


a 5-pixel border
<TABLE BORDER=5>
cell 1 cell 2
cell 3 cell 4


a 15-pixel border
<TABLE BORDER=15>
cell 1 cell 2
cell 3 cell 4


default border, 20 pixels of space between cells
<TABLE BORDER CELLSPACING=20>
cell 1 cell 2
cell 3 cell 4


no space between cells, 20 pixels of buffer space within each cell
<TABLE BORDER CELLSPACING=0 CELLPADDING=20>
cell 1 cell 2
cell 3 cell 4


alignment of text or images within table cells:
(default = middle, left)

vertical alignment:
<td valign=top>

 






 

 


 		 


<td valign=middle>

 






 

 


 		 


<td valign=bottom>

 






 

 


 		 


horizontal alignment:
<td align=left>

 






 

 


 		 


<td align=center>

 






 

 


 		 


<td align=right>

 






 

 


 		 


click here for frames