Adjusting Margins and Borders
A Table Without Borders
| Item 1 | Item 2 | Item 3 |
| Item 4 | Item 5 |
| <TABLE> <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> |
A Table with a Border of 10
| Item 1 | Item 2 |
| Item 3 | Item 4 |
| <TABLE BORDER=10> <TR> <TD>Item 1</TD> <TD> Item 2</TD> </TR> <TR> <TD>Item 3</TD> <TD>Item 4</TD> </TR> </TABLE> |
Cellpadding and Cellspacing
| A | B | C |
| D | E | F |
| <TABLE BORDER CELLPADDING=10 CELLSPACING=0> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR> <TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE> |
| A | B | C |
| D | E | F |
| <TABLE BORDER CELLPADDING=0 CELLSPACING=10> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR> <TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE> |
| A | B | C |
| D | E | F |
| <TABLE BORDER CELLPADDING=10 CELLSPACING=10> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR> <TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE> |
| A | B | C |
| D | E | F |
| <TABLE BORDER=5 CELLPADDING=10 CELLSPACING=10> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR> <TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE> |
Aligment, Captions and Subtables
Demonstrations of Multiple Lines in a Table
| January | February | March |
|---|---|---|
| This is cell 1 | Cell 2 | Another cell, cell 3 |
| Cell 4 | and now this is cell 5 |
Cell 6 |
| <TABLE BORDER> <TR> <TH>January</TH> <TH>February</TH> <TH>March</TH> </TR> <TR> <TD>This is cell 1</TD> <TD>Cell 2</TD> <TD>Another cell,<br> cell 3</TD> </TR> <TR> <TD>Cell 4</TD> <TD>and now this<br>is cell 5</TD> <TD>Cell 6</TD> </TR> </TABLE> |
Align = Left | Right | Center
can be applied to individual cells or whole ROWs
| January | February | March |
|---|---|---|
| all aligned center | Cell 2 | Another cell, cell 3 |
| aligned right | aligned to center | default, aligned left |
| <TABLE BORDER> <TR> <TH>January</TH> <TH>February</TH> <TH>March</TH> </TR> <TR ALIGN=center> <TD>all aligned center</TD> <TD>Cell 2</TD> <TD>Another cell,<br> cell 3</TD> </TR> <TR> <TD ALIGN=right>aligned right</TD> <TD ALIGN=center>aligned to center</TD> <TD>default,<br>aligned left</TD> </TR> </TABLE> |
Valign = Top | Bottom | Middle
can be applied to individual cells or whole ROWs
| January | February | March |
|---|---|---|
| all aligned to top | and now this is cell 2 |
Cell 3 |
| aligned to the top | aligned to the bottom | default alignment, center |
| <TABLE BORDER> <TR> <TH>January</TH> <TH>February</TH> <TH>March</TH> </TR> <TR VALIGN=top> <TD>all aligned to top</TD> <TD>and now this<br>is cell 2</TD> <TD>Cell 3</TD> </TR> <TR> <TD VALIGN=top>aligned to the top</TD> <TD VALIGN=bottom>aligned to the bottom</TD> <TD>default alignment,<br>center</TD> </TR> </TABLE> |
Caption = Top | Bottom
| January | February | March |
|---|---|---|
| This is cell 1 | Cell 2 | Another cell, cell 3 |
| <TABLE BORDER> <CAPTION ALIGN=top>A top CAPTION</CAPTION> <TR> <TH>January</TH> <TH>February</TH> <TH>March</TH> </TR> <TR> <TD>This is cell 1</TD> <TD>Cell 2</TD> <TD>Another cell,<br> cell 3</TD> </TR> </TABLE> |
| January | February | March |
|---|---|---|
| This is cell 1 | Cell 2 | Another cell, cell 3 |
| <TABLE BORDER> <CAPTION ALIGN=bottom>A bottom CAPTION</CAPTION> <TR> <TH>January</TH> <TH>February</TH> <TH>March</TH> </TR> <TR> <TD>This is cell 1</TD> <TD>Cell 2</TD> <TD>Another cell,<br> cell 3</TD> </TR> </TABLE> |
Nested Tables: Table ABCD is Inside Table 123456
| 1 | 2 | 3
|
||||
| 4 | 5 | 6 |
| <TABLE BORDER> <TR> <!-- ROW 1, TABLE 1 --> <TD>1</TD> <TD>2</TD> <TD>3 <TABLE BORDER> <TR> <!-- ROW 1, TABLE 2 --> <TD>A</TD> <TD>B</TD> </TR> <TR> <!-- ROW 2, TABLE 2 --> <TD>C</TD> <TD>D</TD> </TR> </TABLE> </TD> </TR> <TR> <!-- ROW 2, TABLE 1 --> <TD>4</TD> <TD>5</TD> <TD>6</TD> </TR> </TABLE> |
Table Width
Basic 50% Width
| Width=50% | Width=50% |
| 3 | 4 |
| <TABLE BORDER WIDTH="50%"> <TR> <TD>Width=50%</TD> <TD>Width=50%</TD> </TR> <TR> <TD>3</TD> <TD>4</TD> </TR> </TABLE> |
| Item width affects cell size | 2 |
| 3 | 4 |
| <TABLE BORDER WIDTH="50%"> <TR> <TD>Item width affects cell size</TD> <TD>2</TD> </TR> <TR> <TD>3</TD> <TD>4</TD> </TR> </TABLE> |
| WIDTH=100% | This is item 2 |
| 3 | 4 |
| <TABLE BORDER WIDTH="100%"> <TR> <TD>WIDTH=100%</TD> <TD>This is item 2</TD> </TR> <TR> <TD>3</TD> <TD>4</TD> </TR> </TABLE> |
Centering a Table on A Page
| A | B | C |
| D | E | F |
| <CENTER> <TABLE BORDER WIDTH="50%"> <TR> <TD>A</TD> <TD>B</TD> <TD>C</TD> </TR> <TR> <TD>D</TD> <TD>E</TD> <TD>F</TD> </TR> </TABLE> </CENTER> |
Table Width and Nested Tables
| Item 1 | Item 2 | ||
|
Item 4 |
| <TABLE BORDER WIDTH="50%"> <TR> <TD>Item 1</TD> <TD>Item 2</TD> </TR> <TR> <TD> <TABLE BORDER WIDTH=100%> <TR> <TD>Item A</TD> <TD>Item B</TD> </TR> </TABLE> </TD> <TD>Item 4</TD> </TR> </TABLE> |
Height=15%
| HEIGHT=15% | Item 2 |
| 3 | 4 |
| <TABLE BORDER WIDTH="50%" HEIGHT="15%"> <TR> <TD>HEIGHT=15%</TD> <TD>Item 2</TD> </TR> <TR> <TD>3</TD> <TD>4</TD> </TR> </TABLE> |
More HTML and CSS: 
