Login for Software or Support

CoffeeCup - HTML Editor, Flash & Web Design Software

Over 47,729,211 Downloads in 87 Countries

Tell a Friend About Our Cool Software

Buy the Book Here !

Chapter 4: Attributes of the <table> Tag


The <table> tag has quite a few other optional attributes that control various aspects of how the table is displayed. These are described in Table 4-1.

NO XHTML The align and bgcolor attributes of the <table> tag are not supported in XHTML and are deprecated in HTML 4.01. You should use styles to control table alignment and background color in your Web pages when you are authoring to these standards.

Table 4-1. Additional attributes of the <table> tag.

 Attributes  Values  Descriptions
 align  left, center, or right  Controls how the entire table is
 aligned on the page.
 bgcolor  a color name, an  rgb() value, or a  hex value
 (#xxxxxx)
 Specifies the background color  of the table.
 Attribute  Values  Description
 border  A number 0 or
 higher
 The width of the border in
 pixels. Set to 0 for no border.
 cellpadding  A number with or
 without %
 The space between the cell
 contents and borders, expressed
 in pixels or as a percentage of
 the cell width.
 cellspacing  A number with or
 without %
 The space between cells,
 expressed in pixels or as a
 percentage of the cell width.

Let's take a look at how the cellpadding and cellspacing attributes work. The following is a modification of the HTML code presented earlier to include these two attributes:

<table width="400" border="2" cellpadding="10" cellspacing="10%">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

The resulting table is shown in Figure 4-4 with callouts to the cell spacing and cell padding. This shows how cell padding is within cells while cell spacing is between cells. Cell Padding and Cell Spacing
Figure 4-4. Illustrating the difference between cell padding and cell spacing.

Single Borders
The best way to get a single table border is to include the following attribute in the <table> tag:

style="border-collapse: collapse"

You'll learn more about using styles with tables in a later Chapter


Table of Contents
Download Our Software:

... and don't forget about our Free Software

CoffeeCup Home Page | Software | Copyright & Legal | Site Map | © 1996 - 2008 CoffeeCup Software, Inc.