Version:

Acquia Cohesion renames to Site Studio from version 6.2. Tell me more.

    Using modifier classes and ID's

    Use Modifiers to apply styles to an element when a specific class, id or attribute is present.These are most commonly added with JavaScript. For example, .is-active is a class that's added to a Drupal menu link when the link is the active page. In this example, you can add a Modifier called .is-active to your menu link style to apply specific styling when the menu "is active".

    Modifiersonly apply when something adds the class, id or attribute to the element. This most often requires JavaScript.

    Add a modifier using the style tree

    To add a modifier to a style:

    1. Navigate to the Style builder. This is available when you edit Base styles or Custom styles. For more, see Using the style builder
    2. Within the Style editor area, click on the Default button
    3. Within the Style tree, click on the + iconon the selector you want to add a child to
    4. In the menu, click on Modifier
    5. Enter your modifier name in the Custom modifier field. Use (.) for class (#) for id or ( [ attribute name ] ) for attribute.
    6. Click Add
    7. The Selector menu will close and the Modifier will be in the Style tree
    8. Click on the Modifier to apply CSS properties to it.

    DX8 knowledge base icon

    Frequently asked questions

    Get instant answers to common questions. Available online 24/7.

    Find answers

    Raise a ticket icon

    Raise a support ticket

    To raise a ticket, sign into Acquia Cloud and select Help in the top menu.

    Raise support ticket

    Acquia

    Copyright © 2020 Acquia, Inc. All Rights Reserved. Drupal is a registered trademark of Dries Buytaert.