Dreamweaver

Move CSS rules

The CSS management features in Dreamweaver make it easy for you to move CSS rules to different locations. You can move rules from document to document, from the head of a document to an external style sheet, between external CSS files, and more.

Note: If the rule you’re trying to move conflicts with a rule in the destination style sheet, Dreamweaver displays the Rule With Same Name Exists dialog box. If you elect to move the conflicting rule, Dreamweaver places the moved rule immediately adjacent to the conflicting rule in the destination style sheet.

Move CSS rules to a new style sheet

  1. Do one of the following:

    • In the CSS Styles panel, select the rule or rules you want to move. Then right-click the selection and select Move CSS Rules from the context menu. To select multiple rules, Control‑click (Windows) or Command-click (Macintosh) the rules you want to select.

    • In Code view, select the rule or rules you want to move. Then right-click the selection and select CSS Styles > Move CSS Rules from the context menu.

    • Note: Partial selection of a rule will result in the relocation of the entire rule.
  2. In the Move To External Style Sheet dialog box, select the new style sheet option and click OK.
  3. In the Save Style Sheet File As dialog box, enter a name for the new style sheet and click Save.

    When you click Save, Dreamweaver saves a new style sheet with the rules you selected and attaches it to the current document.

    You can also move rules by using the Coding toolbar. The Coding toolbar is available in Code view only.

Move CSS rules to an existing style sheet

  1. Do one of the following:

    • In the CSS Styles panel, select the rule or rules you want to move. Then right-click the selection and select Move CSS Rules from the context menu. To select multiple rules, Control‑click (Windows) or Command-click (Macintosh) the rules you want to select.

    • In Code view, select the rule or rules you want to move. Then right-click the selection and select CSS Styles > Move CSS Rules from the context menu.

    • Note: Partial selection of a rule will result in the relocation of the entire rule.
  2. In the Move To External Style Sheet dialog box, select an existing style sheet from the pop‑up menu or browse to an existing style sheet and click OK.
    Note: The pop‑up menu displays all style sheets that are linked to the current document.
    You can also move rules by using the Coding toolbar. The Coding toolbar is available in Code view only.

Rearrange or move CSS rules by dragging

 In the CSS Styles panel (All mode), select a rule and drag it rule to the desired location. You can select and drag to re‑order rules within a style sheet, or move a rule to another style sheet or the document head.
You can move more than one rule at a time by Control‑clicking (Windows) or Command-clicking (Macintosh) multiple rules to select them.

Select multiple rules before moving them

 In the CSS Styles panel, Control‑click (Windows) or Command-click (Macintosh) the rules you want to select.