Hi!
I’d like to change the colors of the font and bar of the Main Menu in 4 different colors (cyan – magenta – yellow – black).
First I tried to add classes to the menu items, but it didn’t worked.
Now I added to quick CSS the following code:
li#menu-item-18 a .avia-menu-text,
li#menu-item-19 a .avia-menu-text,
li#menu-item-20 a .avia-menu-text,
li#menu-item-21 a .avia-menu-text,
li#menu-item-22 a .avia-menu-text,
li#menu-item-23 a .avia-menu-text {
border-style: none!important;
}
/* cyan */
li#menu-item-18 a:hover .avia-menu-text,
li#menu-item-22 a:hover .avia-menu-text {
color: #009fe3!important;
border-color: #009fe3;
border-bottom-style: solid!important;
}
/* magenta */
li#menu-item-19 a:hover .avia-menu-text,
li#menu-item-23 a:hover .avia-menu-text {
color: #e6007e!important;
border-color: #e6007e;
border-bottom-style: solid!important;
}
/* yellow */
li#menu-item-20 a:hover .avia-menu-text {
color: #ffed00!important;
border-color: #ffed00;
border-bottom-style: solid!important;
}
/* black */
li#menu-item-21 a:hover .avia-menu-text {
color: #cccccc!important;
border-color: #cccccc;
border-bottom-style: solid!important;
}
I’m not that happy about the result.
The look of the active state should be the same like the hover-state, but it doesn’t work… :(
And I’m not sure if this is the best way to come to a solution by “Menu Style – Button Style (Bordered)”…
I’m thankful for any help!
I was looking for a similar post with a solution, but I couldn’t find any…
Hi there,
this question is not relevant for me anymore.
You can delete this post!