Working with Graphics and Tables - New Perspectives on Adobe Dreamweaver CS5, Comprehensive - page 307

Inserting a Table for Page Structure
Now that you have created a page, you will create the structure for the page content
with a table in the same way that you structured page content using divs. You will create
a table, add content to the table, and create CSS styles for the table.

To create the table in the hot.html page:

◗

1. In the Layout category of the Insert panel, click the Table button. The Table dia-
log box opens.

◗

2. Create a table that has 2 rows, 2 columns, 90% table width, 0 border thickness,
5 cell padding, 0 cell spacing, and no header cells, and then click the OK button.
The table is inserted into the page. See Figure 5-50.

Figure 5-50 Table for the hot.html page structure

table information
appears below
the table when
the table is at the
top of the page

2 x 2 table for the
page structure

Next, you will format the cells of the table.

◗

3. Select the right column, and then, in the Property inspector, click the Merges
selected cells using span button

. The cells are merged.

◗

4. Click in the merged cell, and then, in the Property inspector, select Left from the
Horz list, select Top from the Vert list, and type 100% in the W box. The right
column expands to fill most of the table.

◗

5. Click in the upper-left cell, and then, in the Property inspector, select Center from
the Horz list, select Bottom from the Vert list, type 410 in the W box, and type
310 in the H box.

◗

6. Click in the lower-left cell, and then, in the Property inspector, select Center from
the Horz list and select Top from the Vert list.

◗

7. Save the page. See Figure 5-51.