How to: Add and Remove HTML Table Elements in Visual Web Developer
After creating a table, you can add new elements, such as rows, columns, and cells. You can also remove existing elements.
To add a table
Perform one of the steps listed in the following table.
Table type
Steps
A table with no content and no attributes set
From the HTML group of the Toolbox, drag a Table element onto the page.
Visual Studio creates a table with three rows and three columns.
A table with attributes that you specify as you create it
In the Layout menu, click Insert Table, and then specify the table and cell options in the Insert Table dialog box.
To add rows, columns, or cells to a table
Perform one of the steps listed in the following table.
Table element
Steps
A row inside the table
Place the insertion point in the row next to where you want to insert the new row; in the Layout menu, click Insert, and then click Row Above or Row Below.
-or-
Right-click anywhere in the row where you want to insert the new row, click Insert, and then click Row Above or Row Below.
A row at the end of the table
Press the TAB key in the last cell of the table.
A column
Place the insertion point in a cell in the column next to where you want to insert the new column; in the Layout menu, click Insert, and then click Column to the Right or Column to the Left.
-or-
Right-click anywhere in the column where you want to add the new column, click Insert, and then click Column to the Left or Column to the Right.
A cell
Note
The editor does not prevent you from creating a table with uneven numbers of cells in rows. The editor will not automatically span a cell to accommodate uneven numbers of cells in other rows
Place the insertion point in the cell next to where you want to insert the new cell; in the Layout menu, click Insert, and then click Cell to the Left or Cell to the Right.
-or-
Right-click anywhere in the column where you want to insert the new cell, click Insert, and then click Cell to the Left or Cell to the Right.
To add a table caption
Select the table to which you want to add a caption.
In the Layout menu, click Insert, and then click Caption.
Merging Table Cells
You can combine, or merge, cells to form columns or rows that span other columns. For example, in a three-column table, you can combine the cells in the top row to form a single row that spans all three columns.
To merge table cells
Select the table cells that you want to merge. For details, see How to: Select HTML Table Elements and Contents in Visual Web Developer.
Note
You can merge table cells only if the selected cells form a rectangle.
In the Layout menu, click Merge Cells.
-or-
Right-click the selected table cells and then click Merge Cells.
The cells are merged into a single cell with a colspan or rowspan attribute added to the markup, as appropriate.
Removing Table Elements
Removing any table element permanently deletes it from the page.
To remove a table
In the Layout menu, click Delete, and then click Table.
-or-
Select the table and then press the DELETE key.
To remove a row or column from a table
Place the insertion point in the row or column that you want to remove. If you are deleting cells, select the cell or cells that you want to delete. For details, see How to: Select HTML Table Elements and Contents in Visual Web Developer.
In the Layout menu, click Delete, and then click Row or Column.
-or-
Alternatively, select the table row or column that you want to delete and press BACKSPACE.
To remove table cells
Click the table cell or cells that you want to delete. For details, see How to: Select HTML Table Elements and Contents in Visual Web Developer.
In the Layout menu, click Delete, and then click Cells.
-or-
Alternatively, select the table cell or cells that you want to delete and press BACKSPACE.
See Also
Tasks
How to: Select HTML Table Elements and Contents in Visual Web Developer