[Resolved] Main menu text bold on hover

[Giovanni van Heusden]

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;
}

[Tom]

Can you link me to your site with that CSS added? I don’t see anything wrong with it at first glance.

[Giovanni van Heusden]

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

[Tom]

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.

[Giovanni van Heusden]

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

[Tom]

Sounds good! 🙂

[Author]

Posts