[Resolved] How to make navigation menu font turn bold when you hover

Home Forums Support [Resolved] How to make navigation menu font turn bold when you hover

Home Forums Support How to make navigation menu font turn bold when you hover

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • #404003
    Ezekiel

    Hi,
    Please, how can I make my navigation menu font turn bold when I hover and stay bold to show the current page?

    Thank you.

    #404219
    Leo
    Staff
    Customer Support

    Hi there,

    Try this CSS:

    .main-navigation .main-nav ul li a:hover,
    .main-navigation .main-nav ul li[class*="current-menu-"] > a,
    .footer-bar .widget_nav_menu .menu-item a:hover,
    .footer-bar .widget_nav_menu .current-menu-item a {
        font-weight: 600;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #404692
    Ezekiel

    Hello Leo,

    I am personally blown away at the awesomeness of you guys, it worked perfectly.

    Thank you so much, Leo.

    #404990
    Leo
    Staff
    Customer Support

    Glad we’ve been helpful πŸ™‚

    #407709
    Ezekiel

    Hello Leo,

    Thank you for your help. Please, how can I make the footer menu to be and behave exactly like my Primary menu and also to make the hover transition smother?

    I apologize if I am asking for too much, I am quite a novice.

    Ezekiel.

    #407730
    Leo
    Staff
    Customer Support
    #407734
    Ezekiel

    Wow! thank you for the quick response, I just tried the edited code and it didn’t work, it turned off the hover effect altogether.

    #407735
    Ezekiel

    it turned off the hover effect for both the Primary menu and the footer menu. I am using a different menu for the Primary and the footer menu if that’ll help

    #407761
    Leo
    Staff
    Customer Support

    Edited the code again. Made a couple mistakes before. Can you try it again?

    #407878
    Ezekiel

    Just did, but the hover and the current effect are still not working on the footer menu.

    #407880
    Ezekiel

    almost there

    #407984
    Leo
    Staff
    Customer Support

    Oops another edit. It should work now πŸ™‚

    #408070
    Ezekiel

    Yes!!! it works perfectly!!!
    Thank you so much, Leo, you are Heaven sent!

    #408075
    Leo
    Staff
    Customer Support

    Glad I could help!

    #428766
    Ezekiel

    Hello Leo,
    I need help to make the other menu links ‘not move’ when you hover over any other menu item and make the transition smoother. This is because when you hover over one menu it makes the other menu links move.

    So sorry to bug you this much, I have been learning CSS for some time now trying to figure this out on my own but I haven’t been successful so far.

    Thank you kindly.
    Ezekiel.

Viewing 15 posts - 1 through 15 (of 21 total)
  • You must be logged in to reply to this topic.