Dreamweaver CS6: The Missing Manual

Inserting a Table

One of the main problems with HTML tables is that they require a lot of code. Not only is this one reason why CSS is a better page layout method than HTML, it’s also a good reason to use Dreamweaver to create a table. If you’ve ever hand-coded an HTML table, you know what a tangled mess of code it requires; one typo can sink your whole page. Fortunately, Dreamweaver makes the process simple.

1. In the document window, position your cursor where you want to insert a table.

   You can add a table anywhere you can add a paragraph of text. You can even add a table inside another table, by clicking inside a table cell.

2. Choose Insert→Table.

   You can also click the Table button on the Insert panel (it’s under both the Common category and the Layout category). You can also press Ctrl+Alt+T (⌘-Option-T). Either way, the Table dialog box opens (see Figure 6-3).

   

   Figure 6-3. The Table dialog box lets you control a table’s appearance. Leaving the Cell Padding and Cell Spacing fields empty isn’t the same as setting them to 0. If these properties are empty, most browsers insert 1 pixel of cell padding and 2 pixels of cell spacing into tables. If you notice unwanted gaps between cells in a table, or between content in a table and the cell’s edges, empty settings here are the likeliest culprit. To truly leave zero space, set Cell Padding and Cell Spacing to 0. (Dreamweaver remembers the settings ...