Insert Table Dialog Box

Article
10/12/2006

As you create a table, you can select various options for its size and appearance. To open the Insert Table dialog box, select Insert from the Table menu, and choose Table.

Rows
Specifies the number of rows in the table. The resulting table does not include an extra row for column headings. Each <TR> element creates a single table row and each <TD> element creates a single cell in the row. For example, if you enter 1 in the Row field, 1 in the Column field, and accept the other default values in the dialog box, the following code is inserted:

<TABLE cellSpacing=1 cellPadding=1 width=300 border=1>

<TR><TD></TD></TR>

</TABLE>

Columns
Specifies the number of columns. Each <TD> element creates a single cell in a particular row.

For more information, see <TD> Property Pages Dialog Box.

Table Attributes

Width
Indicates the total width of the table. Select units (pixels or percent) from the list next to this box. If you select pixels, you can set an absolute width for the table. The table and its columns will remain the same width regardless of screen resolution. The default width for a new table is 300 pixels. If you select percent, the width of the table will change to accommodate screen resolution. A table whose width value is 25 percent will always be one-quarter the width of the available screen. If you leave this field blank, the table's width will be based on its content.
Height
Indicates the total height of the table in pixels. If you enter a height value, a height value is added to the opening <TABLE> element. For example, if you set the height value to 20 and accept the remaining default values, the opening <TABLE> element would be: <TABLE height=20 cellSpacing=1 cellPadding=1 width=300 border=1>

If you leave this field blank, the table's height will be based on its content.
Background color
Specifies the background color for the table. Select a color name from the list. If you select blue, for example, the bgColor=blue attribute is added to the opening <TABLE> element. You also can click the adjacent ellipse (...) button to display the Color Picker and use it to choose additional colors. For more information, see Color Picker Dialog Box.

Note A background color value set for an particular cell takes precedence over the background color value for the table.
Background image
Specifies a graphics file (.gif, .jpg, or .jpeg) that appears behind the table.

Note To enable the use of a background image, set the targetSchema property of your HTML document to a Web browser that supports HTML 4.0 or later.

The image is displayed at its default size. If the table is smaller than the image, part of the image is cropped. If the table is larger than the image, the image tiles to fill the table background. To specify an image, enter a path or click the adjacent ellipse (...) button to open the Create URL Dialog Box. Then navigate to the image file, and open it.

If the HTML document using the background image is included in a Web project, a relative path to the image from the current directory will be assigned, for example background="images/background.jpg".

If the HTML document using the background image is not included in a Web project, an absolute path will be assigned, for example background="https://Servername/images/background.jpg".

Note The image file is not automatically added to your project. You must add the file to the project using the Add Existing Solution Item dialog box. For details, see Adding New Project Items.
Border size
Specifies the size in pixels of the table border. Choose 0 to specify no border. The default value, which is 1, adds border=1 to the opening <TABLE> element.
Border color
Specifies a color for the table's border. Select a color name from the list or browse to a color in the Color Picker dialog box. If the table has no border, border color is ignored.

**Note ** To enable a border color, highlight, and shadow, set the targetSchema property of your HTML document to a Web browser that supports HTML 4.0 or later and CSS styles.
Highlight color
Specifies the color for the bottom and right sides of the table cell. Select a color name from the list or click the adjacent ellipsis (...) button to display the Color Picker and choose additional colors. For more information, see Color Picker Dialog Box. For example, if you select lime, the following is added to the opening <TABLE> element: borderColorLight=lime. If the table has no border, highlight color is ignored.
Shadow color
Specifies a color for the table's shadow. Select a color name from the list or click the adjacent ellipsis (...) button to display the Color Picker and choose additional colors. For more information, see Color Picker Dialog Box. For example, if you select aqua, the following is added to the opening <TABLE> element: borderColorDark=aqua. If the table has no border, shadow color is ignored.

Alignment
Specifies how the table is aligned with respect to the document margins. Table layout alignment attributes take precedence over more general alignment attributes. For example, if a <TABLE> element is assigned the left alignment attribute, but is inserted within a <CENTER> element, the <table> is aligned to the left margin rather than centered.

Option	Alignment
Center	Aligns equidistant from the left and right margins. Adds `align=center` to the opening `<TABLE>` element.
Left	Aligns with the left margin. Adds `align=left` to the opening `<TABLE>` element.
Right	Aligns with the right margin. Adds `align=right` to the opening `<TABLE>` element.

Cell spacing
Specifies the amount of space in pixels between cells. The default value, which is 1, adds cellSpacing=1 to the opening <TABLE> element.
Cell padding
Specifies the amount of space in pixels between cell contents and the cell border. The default value, which is 1, adds cellPadding=1 to the opening <TABLE> element.

Cell Attributes

Background color
Specifies the background color for all cells in a table. To change or remove the background color for a single cell, place the insertion point in the cell in Design View, and select Property Pages from the View menu. In the <TD> Property Pages dialog box, change the value in the Background Color field. You can select a color name from the popup list or click the adjacent ellipsis (...) button to display the Color Picker and choose additional colors. For more information, see Color Picker Dialog Box. For example, if you select blue, the following is added to the opening <TABLE> element: bgColor=blue.
Border color
Specifies the same color for the borders of all cells in the table. The cell border color takes precedence over the table border color. After you create a table, you can change or remove the border color for each cell individually by placing the cursor in a cell and selecting Property Pages from the View menu, which opens the <TD> Property Pages dialog box. The new values set in <TD> Property Pages are inserted into the markup for the selected cell.

Note To enable a border color, set the targetSchema property of your HTML document to "Internet Explorer 5.0."

Alignment
Specifies how the text in a cell is aligned with its border. After the table has been created, you can change or remove the alignment option for individual cells by placing the cursor in a cell and changing the value in the Horizontal or Vertical Alignment fields in the Cell Property Pages. The default value is left. When you specify an alignment option, the appropriate value is added within each <TD> element.

Option	Alignment
Center	Cell contents are centered horizontally in the cell. Adds `align=middle` to `<TD>` element.
Left	Cell contents are flush with the left border. Adds `align=left` to `<TD>` element.
Right	Cell contents are flush with the right border. Adds `align=right` to `<TD>` element.

Wrap text
Specifies whether text in cells is wrapped within the cell's borders. If cleared, all text in each cell appears on the same line and noWrap is added within each <TD> element. If selected, the browser automatically wraps text in each cell. After the table has been created, you can change or remove the wrap option for each cell individually.

Share via

Insert Table Dialog Box

Table Attributes

Cell Attributes

See Also

Additional resources