No, I’m developing in localhost. But I’m talking about the default a:hover color the theme comes with. For some reason I can use
#menu-item-xx > a:hover {
}
to change height, width, and background color, but not the text’s color.
I was able to do it with this:
#masthead .navbar-nav > li > a:hover {}
@jxhn I’ve tried this as well but couldn’t get it to work. Same as selecting #menu-item-xx, all attributes change but the text’s color.
Strange. It works for me, and I’ve not made any changes to header.php. Are you using the latest version? The only thing I can think of is that you have another declaration that is preventing it.
I would recommend that you not use #menu-item-xx to style the nav. You’re better off using something more general. In fact, if you already have any, that may be what’s overriding it.
@jxhn I totally agree! I wasn’t planning on using #menu-item-xx. My first selector was .nav-link then started experimenting with other selectors including the one you shared.
And yes, I’m using the latest version of the theme. I haven’t touch header.php, though. So I can’t think of anything that might be preventing the declaration. I though it might be Elementor, but the problem is still present even after deactivating the plugin.
This might be a dumb question, but have you tried eliminating all other nav styles you might have written, and added !important to my recommendation?
@jxhn can’t believe I missed that. Good call! Thank you so much.