Docs

[MattHoll]

I’m trying to independently control the dropdown menu colors.

See attached.

Website is here:

http://www.hrvatskohomebrewprvenstvo.beer/

So, basically when you have a dropdown menu, you have different levels of menus nested inside of each other. I would like to control each of those levels so when I click on one dropdown and another dropdown pops up that it is a slightly different color from the first dropdown level.

In the CSS I have this code:

.x-navbar .desktop .sub-menu a {
color: rgb(38, 48, 89);
}

I tried removing the a so it’s just .sub-menu and thought that might be the base level, but no. And I tried putting a b there thinking maybe b would be the second level of dropdowns.

No luck.

Any help is appreciated. Thanks!

[Rupok]

Hi there,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

/* first level submenu */
.x-navbar .desktop .sub-menu a {
  color : #f54;
}

/* second level submenu */
.x-navbar .desktop .sub-menu .sub-menu a {
  color : #333;
}

/* third level submenu */
.x-navbar .desktop .sub-menu .sub-menu .sub-menu a {
  color : #eee;
}

Hope this helps.

Cheers!

[MattHoll]

Great! Thanks!

[Friech]

You’re more than welcome, glad we could help.

Cheers!

[Author]

Posts