The .menu-item is not working in css for wordpress

Question

I just added my menus and that is working but they are the common blue with an underline. So I wanted to give them another color etc.

You can do that with the .nav-item in css. But when i do that:

.menu-item{
  color: #fafafa;
}

It is not showing and the inspector shows this:

I have no idea what this means but I think the browser isn't reading this. How can I fix this problem?

There is another color property with higher specificity value which is overriding it. So try to increase the specificity of your selector by including parent elements. For example nav .menu-item — m4n0
– m4n0, Commented Jun 25, 2020 at 11:19
or you can force it with .menu-item{color: #fafafa !important} — PeterJoe
– PeterJoe, Commented Jun 25, 2020 at 11:23
“I have no idea what this means” - stackoverflow.com/questions/3047056/… — C3roe
– C3roe, Commented Jun 25, 2020 at 11:24
@m4n0 thanks, but it isn't working. I checked and i think it is LI is overriding it but i have not LI in my style sheet — Arjen
– Arjen, Commented Jun 25, 2020 at 11:24
That nav .menu-item is just an example. I am not aware of what code you are using. If you can show me your webpage, I can give you the exact code needed. — m4n0
– m4n0, Commented Jun 25, 2020 at 11:26

Arjen · Accepted Answer · 2020-06-25 11:38:56Z

1

I have found the answer. The .menu-item was being overrided by a

So i did this in my css:

.menu-item a{
color: #fafafa;
}

And now it works. Thanks to everyone who was trying to help!

answered Jun 25, 2020 at 11:38

Arjen

1,1612 gold badges11 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1