Using guides

Guides are lines that you drag onto the document from the rulers. They help you place and align objects more precisely. You can also use guides to measure the size of page elements, or emulate the folds (visible areas) of web browsers.

To help you align elements, Dreamweaver lets you snap elements to guides, and snap guides to elements. (Elements must be absolutely positioned in order for the snap feature to work.) You can also lock guides to prevent them from being accidentally moved by another user.

To create a horizontal or vertical guide:

Drag from the corresponding ruler.

Position the guide in the Document window and release the mouse button.

You can reposition the guide by dragging it again.

NOTE

By default, guides are recorded as absolute pixel measurements from the top or left side of the document, and are shown relative to the origin of the ruler. To record the guide as a percentage, press the Shift key while you create or move the guide.

To show or hide guides:

Select View > Guides > Show Guides.

To snap elements to guides:

Select View > Guides > Snap to Guides.

NOTE

When you resize elements, such as layers, tables, and images, the resized elements snap to guides.

To snap guides to elements:

Select View > Guides > Guides Snap to Elements.

To lock or unlock all guides:

Select View > Guides > Lock Guides.

To move a guide to a specific position:

Double-click the guide.
Enter the new position in the Move Guide dialog box, and click OK.

To view the position of a guide:

Hold the mouse pointer over the guide.

To view the distance between guides:

Press Control (Windows) or Command (Macintosh) and hold the mouse pointer anywhere between the two guides.

NOTE

The unit of measure is the same as the unit of measure used for the rulers.

To change guide color:

Select View > Guides > Edit Guides.
Select the new guide color from the Guide Color pop-up menu, and click OK.

To change the color that indicates the distance between guides:

Select View > Guides > Edit Guides.
Select the color from the Distance Color pop-up menu, and click OK.

To emulate the fold (visible area) of a web browser:

Select View > Guides, and then select a preset browser size from the menu.

To remove a guide:

Drag the guide off the document.

To clear all guides:

Select View > Guides > Clear Guides.

Using guides with templates

When guides are added to a Dreamweaver template, all instances of the template inherit the guides. Guides in template instances, however, are treated as editable regions, so users can modify them. Modified guides in template instances are restored to their original location whenever the instance is updated with the master template.

You can also add your own guides to instances of a template. Guides added in this manner are not overwritten when the template instance is updated with the master template.

Using guides

Using guides

To create a horizontal or vertical guide:

To show or hide guides:

To snap elements to guides:

To snap guides to elements:

To lock or unlock all guides:

To move a guide to a specific position:

To view the position of a guide:

To view the distance between guides:

To change guide color:

To change the color that indicates the distance between guides:

To emulate the fold (visible area) of a web browser:

To remove a guide:

To clear all guides:

Using guides with templates

Related topics