Hello there, I am experiencing an issue with my menu with categories. On my main page everything works fine, but if you click on one of the categories (BLOG, TRAVEL, SMART, etc.) on the category page you will see a new unwanted hover effect(blue underline) on all titles of my menu and top header menu. It appeared after the update on new WP 5.7 and also new Newspaper Theme 10.4.
Here is the link to my homepage where everything is good: https://blogneblog.cz
And here is one of the categories where it is messed:
https://blogneblog.cz/smart/
I was trying to solve it out with CSS customization, but so far no luck.
Could you be so kind and help me solve this issue.
Btw. in the TagDiv composer looks everything good without the unwanted hover effect, but after trying to save it it is just not taking the effect.
Thank you for your help.
Hello,
To remove the unwanted effect and to have the same effect like on the header from homepage, please use this custom code CSS => https://www.screencast.com/t/1KWbOiDOv
body .tdb-menu > li:hover > a, body .tdb-menu > li.tdb-hover > a, body .tdb-menu-items-dropdown:hover .td-subcat-more {
color: #FFFFFF;
background-color: #000000;
}
.tdb_header_menu .tdb-menu > li > a:after {
display:none;
}
Set the code in Theme Panel ->Custom code -> Custom CSS
Hope this helps you!
Thank you!
Hello Anamaria!
Well it worked like a charm!
There is just little hatch, and that is – It turns off hover effect in my Top “STICKY” Menu with items “Domu, Lidé and Shop”.
Again you can compare it with my home page and with every other category.
On my homepage there is slightly graying hover effect, unfortunately after the application of CSS this hover effect is gone on very category site.
Can be tweaked the CSS code you posted to work it like this?
Sorry for my English, but I hope if you compare the Top Sticky Menu on my homepage with the any of the sticky menu in the categories you will see the difference.
Thank you for your help!
Hello,
I just redid the code and the result is this => https://www.screencast.com/t/D3ZEM8SuqWw
This is the code
body .tdb-menu > li:hover > a, body .tdb-menu > li.tdb-hover > a, body .tdb-menu-items-dropdown:hover .td-subcat-more {
color: #FFFFFF;
background-color: #000000;
}
.tdb_header_menu .tdb-menu > li > a:after {
display:none;
}
#menu-td-demo-top-menu > li:hover > a, .td-header-desktop-sticky-wrap.td-header-active .tdb-menu > li:hover > a{
color: #aaa;
}
Hope this helps you!
Thank you!