Navigation
Archive / styling active navmenu page in Renew stack
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • August 9, 2016 at 3:45 pm #1124393
    armintz
    Participant

    i’m using the following css to create a gray box on hover for my navmenu links:

    /* NAVMENU - BOX COLOR AND LINK COLOR ON HOVER */

.x-navbar .desktop .x-nav > li > a:hover,
.x-navbar .desktop .sub-menu a:hover, 
.x-navbar .mobile .x-nav li > a:hover{
  color: #6e6d6d !important;
  background-color:#e2dede;
}

    my question is how can i apply this to the active menu link? so for example, if you’re on the home page, the gray box is displayed for the home link.

    I’m using the Renew stack. will reply with my site link (password protected as it’s in dev mode).

    thank you

    August 9, 2016 at 3:45 pm #1124394
    armintz
    Participant
    This reply has been marked as private.
    August 9, 2016 at 9:48 pm #1124907
    Friech
    Moderator

    Hi There,

    Thanks for writing in! You can add this under Custom > CSS in the Customizer.

    .x-navbar .x-nav li.current-menu-item > a {
  color: #6e6d6d !important;
  background-color:#e2dede;
}

    Hope it helps, Cheers!

    August 10, 2016 at 11:03 am #1125733
    armintz
    Participant

    thanks, works perfectly

    August 10, 2016 at 11:30 am #1125799
    Prasant Rai
    Moderator

    You are most welcome. 🙂

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1124393 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>