Figured it out, nevermind. Syntax error I overlooked 1,000 times in a row.
Happens to me all the time! Remember that there is a Custom CSS feature in the customizer (under Other Options) so you don’t have to create a child theme for simple CSS changes, but you seem very savvy.
Can you mention what was the syntax error?
KOKO,
I basically replicated the above CSS for a bunch of different classes that I thought would apply, because I didn’t know which one would actually get the job done (definitely not good practice, but i will definitely throw in the occasional hack when desperate) and i left the “.” off of the front of the class definition. So in the code above, instead of typing “.current-page item a:hover{…}” I typed “current-page-item a:hover{…}”
The code pasted above doesn’t have the error in it.
That’s the thing. I’m no css bigshot but I saw no errors with the code and it doesn’t work for me.
I’m using a child theme and the style.css has only this in it and it’s not working… =\
KOKO,
Here is all the CSS I used to turn off the shake effect. Something in there worked, but I haven’t gone back to figure out what did and what didn’t. Again…I know this is bad programming style, just sharing what got the job done for me.
.main-navigation li.current-menu-item > a:hover {
animation: none !important;
-webkit-animation: none !important;
}
.menu-item a:hover, .menu-item-type-post_type a:hover, .menu-item-object-page a:hover, .current-menu-item a:hover, .page_item a:hover, .current_page_parent a:hover{
animation: none !important;
-webkit-animation: none !important;
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: color 0 ease-in !important;
transition: none !important;
text-decoration:underline;
}
.current-page-item a:hover{
animation: none !important;
-webkit-animation: none !important;
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: color 0 ease-in !important;
transition: none !important;
}
#site-navigation li a:hover{
text-decoration: underline;
animation: none !important;
}
If you’re able to isolate which style is the only necessary one, I’d love to hear about it : )
– Rick
Actually, this is all you need.
.menu .current-menu-item > a:hover,
.menu .current_page_item > a:hover {
-webkit-animation: none;
animation: none;
}
That’s enough to override the default styles.
I am highly disappointed in both of you.
Scott your code didn’t work. rightsidehealth your code is superfluous and wasteful.
Making me hard refresh a million times… sheesh.
The smallest correct code:
.menu-item a:hover{
animation: none !important; /*Firefox*/
-webkit-animation: none !important; /*Chrome*/
}
Now we just need those selected menu items to not be invisible and all will be well. 🙂
Hmm. I checked and it worked for me. Your code isn’t as specific, but it works.
I wish the shake effect was an option in customization UI of Decode.
