Current Menu Underline - by zf - on WordPress WooCommerce support

This topic has 16 replies, 4 voices, and was last updated 9 years, 1 months ago ago by Brian Johnson

  • Avatar: zf
    zf
    Participant
    March 19, 2015 at 12:45

    Hi Guys, where would i find the current active menu css in the stylesheet.
    I would like to add an underline on active menu.

    Thanks

    15 Answers
    Avatar: stan
    Stan Russell
    Participant
    March 19, 2015 at 13:16

    Hello,

    please try this code:
    .menu > li.current-menu-item > a{text-decoration:underline}

    Regards,
    Stan Russell.

    Avatar: zf
    zf
    Participant
    March 19, 2015 at 13:56

    Hi Stan, would i be able to achieve something like the attached..

    http://prntscr.com/6io7cf

    Also certain menus that will be active are sub-menus (Children)

    Please, contact administrator
    for this information.
    Avatar: stan
    Stan Russell
    Participant
    March 19, 2015 at 14:09

    Hello,

    unfortunately we can not reach you site as it is protected by additional authorization form.
    Please provide with access in private content.

    Regards,
    Stan Russell.

    Avatar: zf
    zf
    Participant
    March 19, 2015 at 14:23

    Hi, details in Pr Content

    Please, contact administrator
    for this information.
    Avatar: Brian Johnson
    Brian Johnson
    Member
    March 19, 2015 at 15:23

    Hello

    Please try this code:

    .menu > li.menu-item > a:hover {border-bottom: 5px inset orange;z-index:9999;}
    .menu > li.menu-item > a {border-bottom: 5px inset white;}

    With best regards
    Brian Johnson

    Avatar: zf
    zf
    Participant
    March 19, 2015 at 16:03

    Hello Brian, thanks for your help thus far (A-Grade)

    However,

    it needs to be on active menu items (parent or child) not hover.
    Also needs to be a specific colour blue or orange

    Thanks

    Z

    Avatar: Robert Hall
    Robert Hall
    Support staff
    March 19, 2015 at 16:26

    Hello,

    Maybe provide screenshot for our better understanding and highlight what exactly you want.

    Regards,
    Robert Hall.

    Avatar: Brian Johnson
    Brian Johnson
    Member
    March 19, 2015 at 16:56

    You are welcome.You may try this code:

    .menu > li.menu-item > a {border-bottom: 3px inset white;}
    .menu > li.menu-item > a:active{border-bottom: 3px inset blue;z-index:99999;}
    
    .nav-sublist-dropdown .container ul > li.menu-item > a:active{border-bottom: 3px inset blue;z-index:99999;}
    .nav-sublist-dropdown .container ul > li.menu-item > a {border-bottom: 3px inset white;}

    With best regards
    Brian Johnson

    Avatar: zf
    zf
    Participant
    March 20, 2015 at 07:32

    Hi Brian/Robert

    Ok we are one step closer.

    The blue needs to be #00457c and the line needs to stay active when on the current menu.
    So for e.g when i click on news (or any menu even if parent or child) the blue line needs to stay.

    Hope i explained properly, there is a screenshot in one of the earlier posts above.’

    Thanks

    Avatar: Brian Johnson
    Brian Johnson
    Member
    March 20, 2015 at 09:25

    Do you mean that parent(main menu) should be underlined with color when submenu makes dropdown action?

    With best regards
    Brian Johnson

    Avatar: zf
    zf
    Participant
    March 20, 2015 at 10:00

    Uhm yes please. so that blue line needs to stay present when a user in on a current page.

    Avatar: zf
    zf
    Participant
    March 20, 2015 at 13:39

    Hi, any ffeedback on this>???

    Thanks

    Avatar: Brian Johnson
    Brian Johnson
    Member
    March 20, 2015 at 13:42

    Currently we are looking to find a solution. You will get feedback as soon as possible. Thank you for understanding.

    With best regards
    Brian Johnson

    Avatar: zf
    zf
    Participant
    March 20, 2015 at 14:44

    No Problem,

    Thank You

    Avatar: Brian Johnson
    Brian Johnson
    Member
    March 20, 2015 at 15:50

    Hello

    Please try this code:

    li.menu-item{border-bottom: 10px inset transparent;z-index:99999;}
    li.menu-item{border-bottom: 5px inset transparent;z-index:99999;}
    li.menu-item-has-children:hover{border-top: 5px inset #00457c;z-index:99999;}
    li.menu-item {border-top: 5px inset transparent;z-index:99999;}

    With best regards
    Brian Johnson

  • Viewing 16 results - 1 through 16 (of 16 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.