[Resolved] Shadow on main menu

Home Forums Support [Resolved] Shadow on main menu

Home Forums Support Shadow on main menu

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1585502
    Ben

    Hey Guys,

    I’m trying to add a box-shadow under the main menu using the following css;

    .main-navigation {
    box-shadow: 0px 2px 16px 0px rgba(0,0,0,.3);
    }

    But I can’t get it work.

    Can you help?

    #1585596
    David
    Staff
    Customer Support

    Hi there,

    try this CSS:

    .main-navigation {
        position: relative;
    }
    
    .main-navigation,
    .sticky-enabled .main-navigation.is_stuck {
        box-shadow: 0px 2px 16px 0px rgba(0,0,0,.7);
    }

    I increased the opacity of the rgba color to make sure its visible. Also update the Sticky nav drop shadow to match. The key fix is the position: relative on the main nav. This makes sure the nav sits over the content, otherwise the page content sits over the box-shadow.

    #1585711
    Ben

    Spot on, thanks David

    #1585743
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.