How to add separators between submenu items

Hi there,

Glad you’re enjoying the theme!

1. What kind of separator are you wanting? Empty space between the primary nav and the sub-menus?

2. Try this:

.main-navigation .sub-menu {
    border: 1px solid #000;
}

3. This should do it:

.main-navigation .main-nav ul ul li a {
    padding-top: 10px;
    padding-bottom: 10px;
}

Adjust the padding values as needed.

Let me know ??

Thanks for the fast reply.

#1 The submenu items are placed verticaly and i’d like a 1px line between the items. Would be nice if this also applies to the mobile menu.

#3 I noticed you can adjust the item height in the customizer but this also affects my logo height. Any chance to exclude the logo from resizing?

Can I sneak in a #4 question? ??

The mobile menu hamburger button. Where does it inherit it’s color from? Can’t seem to find it where I can alter the normal, hover and current state.

1. Try this:

.main-navigation .sub-menu li:not(:last-child) {
    border-bottom: 1px solid #000;
}

3. It shouldn’t affect the logo. The option to set the height in the Customizer is in our pro version, so you’d need to open a topic in our customer forums for help on that – we’re not allowed to support pro features here.

4. It inherits it from your menu items, you can adjust it like this:

button.menu-toggle {
    color: #fff;
}

button.menu-toggle:hover {
    color: #ddd;
}

Thank you, works as always.

Have a nice day !

Thanks! You too ??