Creating and Editing HTML Tables in Design View

The HTML Designer provides tools that make it easy to create and edit tables in your Web pages. The HTML tab of the Toolbox provides access to the Table object and other common objects found in HTML pages.

To create a table from the Toolbox window

  • While editing a Web page in either HTML view or Design view, double-click Table on the HTML tab of the Toolbox.

    - or -

  • While editing a Web page in Design view, drag the Table from the Toolbox onto the page.

To create a table from the Table menu

  1. On the Table menu, choose Insert.

  2. In the Insert Table dialog box, type a value in the Rows and Columns fields, and click OK.

    Tip   If the table has no border, you can choose Visible Borders on the View menu to display border outlines.

Add content to a table cell

  • In Design View, place the insertion point in the cell and type the text.

To add rows and columns to a table

  1. Place the insertion point in the row or column next to where the new one will be.

    Note   Placing the cursor inside a cell is sufficient. You do not have to select the entire cell, column, or row.

  2. Right-click, and choose Insert Rows Above, Insert Rows Below, Insert Columns to the Left, or Insert Columns to the Right from its shortcut menu.

To select rows, columns, cells, or tables

  1. Place the insertion point within the row or column you want to select.

  2. On the Table menu, choose Select, and then choose Table, Column, Rows, or Cell.

    Tip   Some operations, such as setting properties or specifying positioning, require that you select the entire table.

To split cells

  1. Place the cursor within the cell to be split.
  2. Right-click ,and select Split Cell from its shortcut menu. The current cell is split into two cells that fit within the existing column.

To merge cells within a row

  1. Select the cells you want to merge

    Tip   Press the SHIFT key while clicking in adjoining cells to select them.

  2. Right-click, and choose Merge Cells from the shortcut menu. The cells are merged into a single cell that spans the width of the original cells.

To resize an entire <TABLE>, <TR> table row, or <TD> table cell

  1. Open the HTML document for editing in Design view

  2. Open the Document Outline window, and double-click the desired TABLE element.

    In Design view, resizing handles surround the element.

  3. Press down the mouse button to grab a resizing handle for the element, and drag it across the page, resizing the element.

  4. Repeat this procedure until the element is resized as desired.

See Also

Insert Table Dialog Box | <TD> Property Pages Dialog Box | <TABLE> Property Pages Dialog Box | HTML Tab, Toolbox | Document Outline Window | Navigating in the Document Outline Window | Properties Window | HTML Designer | Editing HTML