Navigation
Archive / change background colour of current menu item renew
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • March 27, 2017 at 8:55 am #1421622
    lisacole1
    Participant

    HOME


    Hi
    I have it so that when you hover over a menu item it changes to red, is it possible to get the current page to be red too? So when you are on the home page ‘home’ on the menu has a red background etc.?

    many thanks!

    March 27, 2017 at 9:11 am #1421658
    Thai
    Moderator

    Hi There,

    Please add this CSS:

    .x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a {
  background-color: #9d1915;
}

    Hope it helps 🙂

    March 27, 2017 at 9:25 am #1421698
    lisacole1
    Participant

    you genius! Can I get that to work on the sub menu items too?

    March 27, 2017 at 10:16 am #1421774
    Joao
    Moderator

    Hi There,

    Please update your code to:

    .x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a,
.masthead-stacked .x-navbar .desktop .sub-menu li a:hover {
  background-color: #9d1915;
}

    Hope it helps

    Joao

    March 28, 2017 at 3:08 am #1422721
    lisacole1
    Participant

    ace, thank you!

    March 28, 2017 at 8:48 am #1423012
    Jade
    Moderator

    You’re welcome, Lisa.

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