Hover color for categories in sidebar

On the blog sidebar, I want the categories hover color to be purple, not white.
Right now when you hover over them, they turn white which means they disappear.
Please help me fix this.
I tried variations of this code in CSS but it didn’t work:
///hover color links in sidebar///
ul .side-list .post-list .hovered-list li.cat-item a:hover {
color: #4C0457 !important;
}

Here is the page in question:

thanks
Karen

Try this one and let me know:

.side-list.hovered-list a:hover {
   color: #4c0057 !important;
}

hi, I put that in the CSS and saved it, and it did not work.
Any other suggestions?
thanks for your help!
:slight_smile:
Karen

Hello Karen, you need to put the exact code as given without removing any part of it.

hi there, I copied and pasted it again, just as you have it here, and saved it and once again, no change. It’s not working.
Sorry to be a pain!
Here is the link to the page: https://www.fantaseek.com/blog/majesty-of-fantasy/

And here is the code I put in CSS:
.side-list.hovered-list a:hover {
color: #4c0057 !important;
}

Hello Karen,

It’s not that its not working, but rather its working as per the Cascading Style Sheets rules.

Please see the attached screenshot below and you will realize:

  1. That the reason you are getting white colored links on hover is because you added the rule to do just that, with the !important flag.

  2. Because of the !important flag that you added to make the link white, now the new css I am giving you is being overwritten.

So, when you are working with CSS, you need to keep them in mind.

Remove the one where you have added the rule to make the links white color with !important flag, and then you will not need to edit it via css, you can simply go to customizer and change the link hover color for entire site from there as well.