Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Changing the nav links hover colour only


CarolineGHC

Question

I've added this code into the Custom CSS:

.sub-nav a:active, a:hover {
    outline: 0;
    color: #237CA8 !important;
}

Which has created the desirded effect (a hover state for my nav links) but it's also added the blue hue to all my button hover states. How can I get the Custom CSS to only target my menu nav? (See two images attached)

Thank you in advanced! 

 

Screenshot 2020-11-26 at 00.05.38.png

Screenshot 2020-11-26 at 00.05.44.png

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

4 answers to this question

Recommended Posts

  • 0

Hi!

In your code you have correctly targeted the sub nav links in their active state (.sub-nav a:active) but after that you are targeting all links in their hover state (a:hover) hence why the buttons are changing on hover as they are also considered links.

Try pasting this piece of code into your Custom CSS so that the sub-nav is targeted both times;

//Style active and hover sub nav links
.sub-nav a:active, .sub-nav a:hover {
    outline: 0;
    color: #237CA8 !important;
}

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...