Inserting div tags for layout

Inserting div tags for layout

You can use div tags to create CSS layout blocks and position them in your document. This is especially useful if you have an existing CSS style sheet with positioning styles attached to your document. Dreamweaver enables you to quickly insert a div tag and apply existing styles to it.

To insert a div tag:

  1. In the Document window, place the insertion point where you want the div tag to appear.
  2. Do one of the following:
    • Select Insert > Layout Objects > Div Tag.
    • In the Layout category of the Insert bar, click the Div Tag button.This is a picture of the feature being described.

    The Insert Div Tag dialog box appears.

    This is a picture of the feature being described.

  3. Complete the dialog box.

    For more information, see Setting the Insert Div Tag dialog box options.

  4. Click OK.

    The div tag appears as a box in your document with placeholder text. When you move the pointer over the edge of the box, Dreamweaver highlights it.

If the div tag is absolutely positioned, it acts like a Dreamweaver layer. For information about working with layers, see Setting layer preferences and properties, Managing layers, or Manipulating layers.

For information about working with div tags that aren’t absolutely positioned, see Working with div tags for layout.

Related topics

  • Changing the highlight color for div tags
  • Working with div tags for layout


Getting Started with Dreamweaver
Dreamweaver Basics
Working with Dreamweaver Sites
Laying Out Pages
Laying Out Pages with CSS
Managing Templates
Adding Content to Pages
Working with Page Code
Preparing to Build Dynamic Sites
Making Pages Dynamic
Developing Applications Rapidly