Home > Products > Dreamweaver > Support > Using Tables to Present Content
Dreamweaver Icon Macromedia Dreamweaver Support Center - Using Tables to Present Content
Page layout with tables in Dreamweaver 3

Tables are widely used by Web designers to do page layout. Tables give a designer control over the positioning of images and text on the page.

However, HTML tables were originally intended for displaying tabular data on a Web page, not for use in page layout. Reliable page formatting wasn't a feature in tables, and so a table design that looks good in Dreamweaver's Document window can look misaligned in the browser window.

When you use tables to design a Web page in Dreamweaver, use the following tips to make sure your design looks as good in the browser as it does in Dreamweaver.

Converting tables to layers
Setting margin properties
Centering the table on the page

Converting tables to layers
Converting your tables into layers and then back into tables allows Dreamweaver to add special invisible placeholders that keep your design intact for the browser. Do this for every table design you create to improve the look of your Web pages in a browser.

To convert your tables into layers, choose Modify > Layout Mode > Convert Tables to Layers.

To convert the layers back into tables, choose Modify > Layout Mode > Convert Layers to Tables.

Setting margin properties
Web browsers add extra space around a table to offset it from the top and left side of the browser window. To display your table flush against the edge of the window, set the margin properties.

Choose Modify > Page Properties, then enter zero for each of the following fields: Left Margin, Top Margin, Margin Width, Margin Height.

In most cases, these settings cause your table to appear flush against the top and left edges of the window, although some older browsers may still add the extra space.

Note: Left Margin and Top Margin establish margins in Microsoft Internet Explorer, while Margin Height and Margin Width establish margins in Netscape Navigator. It's best to set all of these fields; otherwise your margins may appear correctly in one browser but incorrectly in another.

Centering the table on the page
To center a table on the Web page, simply set the table alignment.

Select the table (not table cells) and use the Property inspector to set Align to Center.

Note: To make sure you select the table instead of a cell, click the table's outer border.

Emily Ricketts

Emily Ricketts is a technical writer in the Dreamweaver documentation team.

convert, format, HTML, layer, layout, page, table

25 July 2000