How to add shadow under menu header and change color of submenu

  • Hi,

    I have almost finished launching my webshop. But I have two questions:

    1. How do I add shadow under my head menu for more depth?
    2. How do I give the submenus a white background color? Right now it is grey.

    I’ve tried a lot of CSS but all of them didn’t work.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi.
    Have you tried that? I’m not sure if that is what you meant, but if so…

    1.

    .storefront-primary-navigation {
	box-shadow: 0px 6px 6px 0px #bbb;
}

    2.

    .main-navigation ul.menu ul.sub-menu, .main-navigation ul.nav-menu ul.children {
	background-color: white;
}

    Add both of them to CSS file in below that media query:
    @media screen and (min-width: 768px)

    Thread Starter zovoordelig

    (@zovoordelig)

    Thank you for the reply. Both are not working. When I put them I see the letters being red. Am I doing something wrong?

    An example of the shadow i want under my menu header: https://www.zalando.nl/
    Zalando has a grey shadow under the menu. This site is just an example.

    Thread Starter zovoordelig

    (@zovoordelig)

    Well I fixed my second question using the plugin Max Mega Menu..

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to add shadow under menu header and change color of submenu’ is closed to new replies.