change colour on hover link

Post here the link to your website!

https://www.heylinprojects.com/testwebsites/keepingupwiththekakes/

this is the link to my website

Hello Karen,

This code will change the color when you hover on menu from green to pink:

nav.main-menu ul > li:hover > a, nav.main-menu ul > .current-menu-item > a {
    background-color: #d32399 !important;
}

And this code will change the current page color from green to pink:

nav.main-menu ul .current_page_item > a {
    background: #d32399 !important;
}

Hope it helps!

Thank you for the code I’m entering it into the style sheet css it doesn’t seem to be working should I be adding the code her or else where

Hi,
yourdomain/wp-content/themes/ascent/includes/css/main.css
on line 539

change this:

nav.main-menu ul .current_page_item > a {
    background: #1ABC9C none repeat scroll 0% 0%;
    color: #FFF;
}

to this:

nav.main-menu ul > li:hover > a, nav.main-menu ul > .current-menu-item > a {
    background-color: #d32399;
    color: #FFF;
}

and on line 543 change this:

nav.main-menu ul > li:hover > a, nav.main-menu ul > .current-menu-item > a {
    background-color: #1ABC9C;
    color: #FFF;
}

to this:

nav.main-menu ul .current_page_item > a {
    background: #d32399;
    color: #FFF;
}

if you choose to edit your theme files, all your changes will be lost if the theme will be updated. You can use a child theme or if you use the wordpress jetpack plugin, it gives you the option to add custom css.

If you will follow the plugin solution, then use this code:

nav.main-menu ul > li:hover > a, nav.main-menu ul > .current-menu-item > a {
    background-color: #d32399 !important;
}

nav.main-menu ul .current_page_item > a {
    background: #d32399 !important;
}

.

It should work!
Have fun! Greetings from Sunny Greece!!

that’s worked perfect with the jet pack thanks for your help ??

You are welcomed!

Please mark this topic as resolved!