Creating styles for menus

    Use Custom list styles to affect both the appearance and interactivity of your menus. The following classes are applied to your menu list items when a user interacts with a menu link. You can use these classes to affect the appearance and display of your menu list items which content your menu links.

    • is-active - Is applied to the menu list item when the user is on the current link page
    • has-children - Is applied to the menu list item if the menu item, has children (sub-menus)
    • is-expanded - Is applied to the menu list item if the menu item has children (sub-menus) and they are expanded
    • is-collapsed - Is applied to the menu list item if the menu has children (sub-menus) and they are collapsed
    • in-active-trail - Is applied to the menu list item if the menu item is within the active trail.

    Menu style helpers

    The process of creating a Custom list style for an interactive menu is quite complex unless you are an experienced front-end developer. For this reason, DX8 includes a number of Style helpers for you to use to quickly create styles for different types of interactive menus. For information on how to use Style helpers, see Using style helpers.

    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