- This topic has 12 replies, 2 voices, and was last updated 3 years, 2 months ago by
.
-
Posts
-
Hi there,
This is on my site fivepixels.co.uk – I’ve added a custom css class called ‘clientlogin’ to a menu item (under appearances->menu). The menu item is called “Client login”.
Then I’ve added
.clientlogin {
color:#ff77od;
}to custom css, but the menu item stays white (which is what I have set it to using GPs color add on).
How can I get the colour to change for a single menu item?
I’m sure this is simple, but it’s getting late and I’ve been staring at it for ages… any help much appreciated.
Have I explained that properly? Please ask if you have no idea what I mean.
Thank you!!
Faye.Customer Support
Hi there,
Menu items are always a bit tricky as the CSS gets overwritten.
Try changing it to this:
.main-navigation .main-nav ul li.clientlogin a { color: #ff77od; }Let me know.
Nope – the new colour is still crossed out in the inspector and the menu remains white.
I can’t actually get it to change at all using the css inspector 🙁It says Invalid Property value so check the hex code. If you try this it should work:
.main-navigation .main-nav ul li.clientlogin a { color: #000000; }Oh man, I had an ‘o’ in my hex.
See? Screen blindness. Time for me to go to bed.Thank you so, SO much – I’ll be able to sleep now 🙂
No problem 🙂
I am having the same issue. Was getting ready to post and decided to search first. Tried your suggestion Leo but the styles are overridden by colors in customizer for main menu.
Even with the long selector here? https://generatepress.com/forums/topic/custom-css-in-menu-item-not-working/#post-341622
Can you link me to the page?
Actually, I’m having a variation on this issue; will open a new thread.
Sounds good 🙂
Similar issue with the font color for the main menu and not being able to change the color. I have tried the suggested selectors above, CSS class, menu item #, all of them together but no luck.
websitewannabe.comThanks in advance.
ChrisFYI I was able to get the font color to work by using the .main-navigation .main-nav ul li.custom-css-class a {} from this article: https://docs.generatepress.com/article/adding-buttons-navigation/
Thanks!
Customer Support
Hi Chris,
Glad you’ve figured it out 🙂
- You must be logged in to reply to this topic.
