Tables - Web Development and Design Foundations with XHTML - page 317

bordercolor attribute is not part of the official W3C Recommendations but is
included here because it is widely used and well supported by browsers. The table
shown in Figure 8.8 has a border set to 5 and bordercolor set to a dark color.

Figure 8.8
Table with
bordercolor set
to a dark color

The width Attribute. This attribute specifies the width of the table in either pixels
or in a percentage of the Web page. The table will stretch to fit the entire width of the
page if 100% is used. If width is not specified, the browser determines the width of a
particular table by calculating the width of the elements and text it contains. Use the
width attribute when you want more control over your Web page. The table shown in
Figure 8.6 is centered and has a width set to 75%. The XHTML code for the table tag
is <table border="1" align="center" width="75%">

FAQ

Which is better, specifying width by pixels or by percentage?

It depends. Keep in mind that visitors to your Web page will use monitors with different screen
resolutions. If you need your table to have a fixed width that you specify, use pixels. If you'd
like your table to be flexible and to resize with the browser window, use percentages. It's a
good idea to test your Web pages using different screen resolutions.

The cellspacing Attribute. This attribute specifies the distance between the cells
in pixels. If you omit the cellspacing attribute, the default value (usually around
2 pixels) is determined by the browser. The table shown in Figure 8.9 has cellspacing
set to 10 . The XHTML code for the <table> tag follows:

<table border="1" cellspacing="10">

Figure 8.9
Table with
cellspacing set
to 10

The cellpadding Attribute. This attribute specifies the distance in pixels between
the cell contents and the edge of the cell. If you omit the cellpadding attribute, the
default value is 1 pixel. An example with cellpadding set to 10 is shown in Figure 8.10.
The XHTML code for the <table> tag follows:

<table border="1" cellpadding="10">