Adobe Dreamweaver CC 2015 - Manual (Page 174)

167
Layout and design
Last updated 6/3/2015
Presenting content with tables
Note: The user interface has been simplified in Dreamweaver CC and later. As a result, you may not find some of the
options described in this article in Dreamweaver CC and later. For more information, see
this article .
About tables
Tables are a powerful tool for presenting tabular data and for laying out text and graphics on an HTML page. A table
consists of one or more rows; each row consists of one or more cells. Although columns aren’t usually explicitly
specified in HTML code, Dreamweaver enables you to manipulate columns as well as rows and cells.
Dreamweaver displays the table width and the column width for each table column when the table is selected or when
the insertion point is in the table. Next to the widths are arrows for the table header menu and the column header
menus. Use the menus for quick access to common table-related commands. You can enable or disable the widths and
menus.
If you do not see a width for the table or for a column, then that table or column does not have a specified width in the
HTML code. If two numbers appear, then the visual width as it appears in Design view doesn’t match the width
specified in the HTML code. This can happen when you resize a table by dragging its lower-right corner or when you
add content to a cell that’s larger than its set width.
For example, if you set a column’s width to 200 pixels and then add content that stretches the width to 250 pixels, two
numbers appear for that column: 200 (the width specified in the code) and (250) in parentheses (the visual width of the
column as it’s rendered on your screen).
Note: You can also lay out your pages using CSS positioning.
Table formatting precedence in HTML
When formatting tables in Design view, you can set properties for the entire table or for selected rows, columns, or cells
in the table. When a property, such as background color or alignment, is set to one value for the whole table and another
value for individual cells, cell formatting takes precedence over row formatting, which in turn takes precedence over
table formatting.
The order of precedence for table formatting is as follows:
1 Cells
2 Rows
3 Table
For example, if you set the background color for a single cell to blue, then set the background color of the entire table
to yellow, the blue cell does not change to yellow, since cell formatting takes precedence over table formatting.
Note: When you set properties on a column, Dreamweaver changes the attributes of the td tag corresponding to each cell
in the column.
About splitting and merging table cells
You can merge any number of adjacent cells—as long as the entire selection is a line or a rectangle of cells—to produce
a single cell that spans several columns or rows. You can split a cell into any number of rows or columns, regardless of
whether it was previously merged. Dreamweaver automatically restructures the table (adding any necessary colspan or
rowspan attributes) to create the specified arrangement.