Docs

[MattHoll]

Hello.

Please see screen cap. See that white strip on the top and bottom? I’d like to get rid of that.

After reading around the forum, I used this CSS to customize it:

/*Dropdown menu customization

/* main nav */
.masthead-inline .desktop .x-nav {
float:left;
margin-left: 10px; /* spacing between logo and menu */
}

/* sub menu background color and text color on*/
.x-navbar .desktop .sub-menu a {
background-color: #e0dbc2;
font-size: 14px;
}

/* sub menu background color and text color on hover */
.x-navbar .desktop .sub-menu a:hover {
background-color: #374fa4;
color: #f2c054;
}

I tried adding:

border-top: none !important;
border-bottom: none !important;

into one section, like so:

.x-navbar .desktop .sub-menu a {
background-color: #e0dbc2;
font-size: 14px;
border-top: none !important;
border-bottom: none !important;
}

But that did nothing. Can’t quite figure this one out.

Thanks for any help.

[MattHoll]

Upon tweaking colors further, I discovered that I think there’s a layer underneath that is white, not that that is a border.

I tried to change those dropdowns to partially transparent and they didn’t show the underlying image underneath the dropdown. Instead, they were showing white underneath. I verified this by making if fully transparent and it indeed showed white.

So, looks like there’s a white layer underneath. Perhaps to give that rounded corner? Not sure, but I’d like to be able to turn that on and off to see what I like and control the color if I want to keep it.

Help?

Thanks!

[Rad]

Hi there,

Thanks for posting in.

You can change this CSS

.x-navbar .desktop .sub-menu a {
background-color: #e0dbc2;
font-size: 14px;
}

to this

.x-navbar .desktop .sub-menu, .x-navbar .desktop .sub-menu a {
background-color: #e0dbc2;
font-size: 14px;
}

If it’s not working then please provide your site’s URL too.

Thanks!

[MattHoll]

Yeah, that didn’t work.

That made the background and the text the same color. When I tried to specify them individually, it did nothing. And that frame or underlying layer is still there. You can see it when you hover over the dropdown.

Please see attachment.

Site is here, dropdown is under “Photo galleries”. This is Integrity Stack.

http://www.hrvatskohomebrewprvenstvo.beer/

Thanks for your help!

-Matt

[Paul R]

Hi,

You can add this under Custom > Edit Global Edit Global CSS in the Customizer.

.x-navbar .desktop .sub-menu {
    padding:0;
}

.x-navbar .desktop .sub-menu a {
    color:#000;
}

Hope that helps.

[MattHoll]

Perfect! Thanks!

[Thai]

If you need anything else please let us now.

[Author]

Posts