Styling the Twenty Sixteen main navigation
-
Hello,
I’m having a problem styling the default main navigation of the Twenty Sixteen child theme.
http://s169654727.onlinehome.us/data/Screenshot.png
As you can see in the above screenshot, when you hover a sub menu in the dropdown, the parent menu item, “Instructors” in this case, turns to blue which is set as “Link Color” in the admin console (Appearance -> Customize).
I cannot seem to find the style to override this so that I can change the text color of the parent menu item when a sub menu is hovered.
Please can someone tell me how to accomplish this?Thanks a million in advance.
-
If you send the link to your page I can take a look and help you with this.
Thanks kosmicbird.
Here is the link of the demo site in progress.
http://demo.amritapilates.com/- This reply was modified 8 years, 2 months ago by sasori390.
Here is what you can target to change the color of the parent menu link when you’re hovering over a subitem.
.menu-toggle:focus, a { color: #ffffff!important; }
You have a ton of !important tags… I’m not sure if you are the one who added them or if it was hard coded into the theme. I would advise you to use !important tags sparingly as they can make it difficult to modify styles in some situations (as you are experiencing now).
You will have to use an important tag in the code above for it to work. If/when you have time maybe try to organize the code a bit and get rid of important tags where they aren’t absolutely necessary. This may include you needing to change settings such as that default link color (change it to the proper color you need for most of your links so you don’t have to keep using the !important tags everywhere).
- This reply was modified 8 years, 2 months ago by kosmicbird.
kosmicbird, Thank you for the code! and thank you for your suggestion on the important tag. I know it’s my bad habit…
- The topic ‘Styling the Twenty Sixteen main navigation’ is closed to new replies.