Using child selectors

    Use child selectors to target and style children of an element. For example, when creating an Unordered list style you will add a child li to style the list items

    Create Layout custom styles and use child selectors to target and style elements within containers. For example, apply a child p to a Layout custom style to target all paragraphs within a container.

    Adding a child selector to the style tree

    To add a child selector:

    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 + icon on the selector you want to add a child to
    4. In the menu, click on Child selector
    5. Enter an Element or .class in the Child selector field
    6. Click Add
    7. The Selector menu will close and the Child selector will be in the Style tree.

    Child-selector.gif

    By default, child selectors are added as Descendant selectors. This means that all children that match your child element will be styled. You can change the type of child selector by applying a Combinator to it. For more, see Using combinators.

    Cohesion DX8 Help center

    Launch our Help center to raise a support ticket or search our knowledge base of common questions and answers.

    DX8 knowledge base icon

    Knowledge base

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

    Find answers

    Raise a ticket icon

    Raise a support ticket

    Log in to the Help center to raise an issue. Available Monday - Friday, 09:00 - 17:00 GMT.

    Raise ticket