[carrie01]

carrie01

#4303

I have worked out how to change the colour of the Header Menu using Firebug but I can’t work out how to change the hover & dropdown colour that is now grey. Can anyone help me please?

[Kenneth John Odle]

Kenneth John Odle

#27832

Go over to my bookblog: http://bookblog.kjodle.net and take a look at the stylesheet.

[carrie01]

carrie01

#27833

Thank you for the link. I have spent ages trying to figure it out but I really don’t understand which parts of the code relate to the header menu hover and dropdown background colours. I have looked at several sites but I am a newbie. Am I just missing something simple or am I trying something too advanced?

[Anonymous]

Anonymous

#27834

Honestly, if you don’t know much about CSS, you’re probably trying something too advanced for your current level (start practicing). However, we do provide many great resources… just follow the link below:

https://forum.graphene-theme.com/graphene-support/beginners-resources-possible-sticky

You can skip down to the css part if you’d like to begin there.

[Anonymous]

Anonymous

#27835

Hi carrie, I tried Firebug to find the CSS for changing the dropdown menu colors, and you’re right, it wasn’t easy, but here it is:

To choose the background color of the dropdown menus:

#header-menu ul li {

background: #123abc;

}

And to choose the color of the dropdown menu when you hover the mouse:

#header-menu ul li:hover{

background: #123abc;

}

Of course, change 123abc to whatever hex code color you want. Hope it helps!

[carrie01]

carrie01

#27836

Thank you for finding this code. I’ve tried a few times to get it to work but have not had any luck yet. I’ve cleared my cache, tried it in custome css and in child theme but nothing changes. I’ll keep trying. Thanks again.

[Anonymous]

Anonymous

#27837

Hmm, that’s weird, it works okay in my child theme’s style.css. I’m no expert, but maybe you can try with something other than “#header-menu ul li”, for example:

#header-menu ul li:hover > a or #header-menu ul li.current-menu-item > a or #header-menu ul li.current-menu-ancestor > a or #header-menu ul li a or #header-menu ul li:hover a and see if any of those are the ones that change the color for you. Otherwise, I’m stumped, sorry! 🙂