Table Padding and Spacing

Table Padding in HTML

Tables are formatting using HTML attributes or CSS sytles. Table Cell padding refers to the space inside of each table data. It is the distance from the inside wall to the text. The cell padding of the first table is set at 5 pixels.
<table cellpadding="5">
The second table cell padding is set at 10 pixels.

cellpadding=5px

Red #ff0000 Blue #0000ff
Orange #ff9933 Yellow #ffff00

cellpadding=10px

Red #ff0000 Blue #0000ff
Orange #ff9933 Yellow #ffff00

Table Cell Spacing

Table Cell Spacing refers to the space between each table data. It is distance between each table data. The cell spacing in the left table is set at 4 pixels or set the value for any number.

<table cellspacing="4px">

cellspacing="4px"

Red #ff0000 Blue #0000ff
Orange #ff9933 Yellow #ffff00

cellspacing="10px"

Red #ff0000 Blue #0000ff
Orange #ff9933 Yellow #ffff00

Table Widths and Heights in HTML

Table widths can be set for the entire table or for individual cells. Generally, the table width is determined by the cell contents if not specified. Unit of measurement used for tables is percentages or pixels.
Table height is supported by most browser althought it is not supported by XHTML.

<table width="100%px">

 

<colgroup>
<col width-20%" />
<col width="30%" />
<col width="50%" />
</colgroup>

Set Row Heights in HTML

The row height is distance from the top of the cell to its bottom set in pixels. Most browser will display the value but it is not part of W3C rules.

<tr height="10px">
Web Design with XHTML Part II
Doris Cuffey, Instructor