CODEWITHSUNDEEP
htmlcsscss-selectors
user4653153
user4653153

Reputation:

change menu color on mouseover

I'm building a website through WP, and i've gotta change mouseover color to blue. I can't figure out how to do that.

This is the website

I've tried selecting it through id

#menu-menu-principale-effettivo a:hover{
    color:blue;
}

But it didn't work. I've tried to look on the net but since i'm new to css, i've probably miss understood how to do that.

Thank's in advance

[Solved] by adding at the end of the static.css file:

@media screen and (min-width: 992px) 
{
#cshero-header-navigation .main-navigation .menu-main-menu > li:hover > a {
color: #073576 !important;
}
}
@media screen and (min-width: 992px) {
#cshero-header-navigation .main-navigation .menu-main-menu > ul > li > a .menu-title:before, #cshero-header-navigation .main-navigation .menu-main-menu > li > a .menu-title:before {
background-color: #073576 !important;
}
}
@media screen and (min-width: 992px) 
{
#cshero-header-navigation .main-navigation .menu-main-menu > li.current-menu-ancestor > a {
color: #073576 !important;
}
}
@media screen and (min-width: 992px)
{
    #cshero-header-navigation .main-navigation .menu-main-menu > li.current-menu-item > a
    {
        color: #073576 !important;
    }
}

note: wp is a weird thing, the custom css I was trying to put in wasn't working through the "custom css" tool and I had to write it manually into the file.

Upvotes: 0

Views: 1369

Answers (5)

caldera.sac
caldera.sac

Reputation: 5088

add this to your css

#menu-menu-principale-effettivo li a span.menu-title:hover{
    color:blue;
}

Upvotes: 0

Bharath kumar Jalla
Bharath kumar Jalla

Reputation: 26

Try this

#menu-menu-principale-effettivo a:hover{
color:blue !important;}

Upvotes: 0

Aakash Thakur
Aakash Thakur

Reputation: 3895

You can add the styles to your links. 

 <a href="http://www.equa.it/bergamini/home"
 class="menufinale"
 onMouseOver="this.style.color='#00F'"
 onMouseOut="this.style.color='#999999'">
<span class="menu-title">Home</span>
</a>

Upvotes: 0

Gowtham
Gowtham

Reputation: 1597

Add this css

ul#menu-menu-principale-effettivo a span:hover{
color:blue
}

enter image description here

Upvotes: 0

Stivo Maich
Stivo Maich

Reputation: 11

Try adding the !important tag after your css property. For example #menu-item:hover{ color: blue !important; }

Upvotes: 1

Related Questions