Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Adobe Dreamweaver

This chapter is from the book

Adding Horizontal Rules

A horizontal rule is a line that runs across the page, creating a division between parts of the document (Figure 4.37). By default, a horizontal rule in Dreamweaver is the width of the page, is 1 pixel high, and has a small drop shadow. You can change these properties if you want.

Figure 4.37

Figure 4.37 This horizontal rule separates two sections of the page.

To insert a horizontal rule:

  1. Click in the page to place the insertion point where you want the horizontal rule to appear.
  2. Choose Insert > HTML > Horizontal Rule.

    A line appears as wide as the page.

To modify a horizontal rule's properties:

  1. Click the horizontal rule to select it.

    The Property Inspector changes to show the Horizontal Rule properties (Figure 4.38).

    Figure 4.38

    Figure 4.38 You can change the width and height of a horizontal rule in the Property Inspector.

  2. Do one or more of the following:
    • Type a number in the W (for Width) field, and choose either pixels or % from the pop-up menu. Choosing pixels creates a fixed-width line; choosing % creates a line that expands or contracts depending on the width of the site visitor's browser window.
    • In the H (for Height) text box, type a number for the horizontal rule. This height is measured in pixels.
    • From the Align pop-up menu, choose Default, Left, Center, or Right. The Left and Right choices are only going to be useful if the width of the horizontal rule is less than the width of the page.
    • The Class pop-up menu allows you to apply a CSS style to the horizontal rule.
    • If you select the Shading check box, the line appears as an outline, rather than as a solid line.
  • + Share This
  • 🔖 Save To Your Account