Archived topic
Main menu text bold on hover
5 replies · Started by Giovanni van Heusden on November 14, 2016
Hi Tom,
I have installed a freefont and used @fontface, this works fine.
I want to make the text in the main menu bold, when active and on hover.
When I change CSS code in firebug, it works but not when I paste in in editor.
I also used !important.
Can't figure it out, can you help?
Thanks
This is the code:
.main-navigation .main-nav ul .current-menu-item > a, .main-navigation .main-nav ul .current-menu-parent > a, .main-navigation .main-nav ul .current-menu-ancestor > a, .main-navigation .main-nav ul .current-menu-item > a:hover, .main-navigation .main-nav ul .current-menu-parent > a:hover, .main-navigation .main-nav ul .current-menu-ancestor > a:hover, .main-navigation .main-nav ul .current-menu-item.sfHover > a, .main-navigation .main-nav ul .current-menu-parent.sfHover > a, .main-navigation .main-nav ul .current-menu-ancestor.sfHover > a {
background-color: #ffffff;
font-family: fontin_sans_rgbold;
}
Can you link me to your site with that CSS added? I don't see anything wrong with it at first glance.
Hi Tom,
I am building the site locally, so I can't send you a link.
I pasted the custom CSS at the top of the CSS file.
This worked partially. The active state text is now Bold.
Only when I hover over the button the font stays normal, on click it become bold.
On hover the about us should also become bold.
Thanks
Hmm, I'm afraid there's just too many things that could cause something like that - it's impossible to guess without seeing the actual page.
Try using the developer tools inside your browser to inspect the element - it might show you which CSS is overwriting it.
Hi Tom,
The site is in production so it's ok.
If I don't figured it out then I will ask again when site is live.
Thanks
Sounds good! :)
