How to Use Table Cell Options in Dreamweaver - dummies

How to Use Table Cell Options in Dreamweaver

By Janine Warner

Dreamweaver lets you specify options for individual cells in a table. When you select a cell, which you can do by clicking to place the cursor anywhere inside the cell area, the Property inspector changes to display the individual properties for that cell, such as the formatting and alignment of the contents of a particular cell.


Beginning in Dreamweaver CS4, the Property inspector features both HTML and CSS settings. CSS settings are generally preferred and work the same for the contents of a table cell as they do for content anywhere else on a web page.

You can also change multiple cells at the same time. Suppose that you want to format some cells in your table with a certain background color and style of text. You can apply the same properties to multiple cells by selecting more than one cell at a time. Any properties you change in the Property inspector apply to all selected cells. Here are tips for selecting cells:

  • To select adjacent cells, press the Shift key while clicking to select cells.

  • To select multiple cells that aren’t adjacent, press the Ctrl key and click each cell you want to select.

  • If you’re having trouble selecting an individual cell because it contains an image, click the image and then use the ← or → key on your keyboard to move the cursor and deselect the image, which activates the Property inspector and displays the options for that cell.

When one or more adjacent cells are selected, the top half of the Property inspector controls the formatting of text and URLs in the table cells. The lower half of the Property inspector provides the table cell attribute options, as follows:

  • Merge Selected Cells Using Spans icon: Merges two or more cells. To merge cells, you must first select two or more cells by clicking and dragging or by pressing the Shift or Ctrl key while selecting multiple cells.

  • Split Cell into Rows or Columns icon: Splits one cell into two. When you select this option, a dialog box lets you specify whether you want to split the row or the column. You can then specify the number of columns or rows, which controls how many times the cell divides. Note that you can apply the Split Cell option to only one cell at a time.

  • Horz and Vert: Controls the horizontal alignment or vertical alignment, respectively, of the cell contents.

  • W and H: Controls the cell’s width or height, respectively.

  • No Wrap: Prevents word wrapping in the cell. The cell widens to accommodate all text while you type or paste it into a cell. (Normally, the excess text just moves down to the next line and increases the height of the cell.)

  • Header: Formats a cell’s contents by using a header tag, which displays the text in bold and centered by default in most web browsers.

  • Bg (color): Click in the color well to select a background color from the color palette or enter a hexadecimal color code in the text field. If you use the color palette, the hexadecimal code is entered automatically in the Bg color field. Make sure you include the # sign if you add your own hexadecimal color or the color will not display properly in many browsers.

Although the alignment, color, and formatting options in the Property inspector are handy, using CSS is the preferred option.