Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • October 9, 2018 at 4:45 pm #1019539
    Freek

    Hi,

    I use the following code to change the hover over background color in mega menu. Works fine!

    .header_color .main_menu .menu ul li a:hover, .header_color .av-subnav-menu ul a:hover {
    background-color: rgba(234, 117, 0, 0.05);
    border-radius: 50px;
}

    Now I want certain menu items to have another hover over color. So I tried the following code without luck.

    #menu-item-632  ul li a:hover, .header_color .av-subnav-menu ul a:hover {    background-color:  rgba(5, 105, 105, 0.05);
    border-radius: 50px;
}

    What is wrong in the code? Can you help me out? THX Freek

    October 10, 2018 at 5:36 am #1019765
    Rikard

    Hey Freek,

    Are you placing the second block under the first one? Did you try to use !important after you arguments in the second one?

    Best regards,
    Rikard

    October 10, 2018 at 8:15 am #1019825
    Freek

    Rikard,

    I placed the following css code block, just beneath the first block of code.

    #menu-item-224 .header_color .main_menu .menu ul li a:hover, .header_color .av-subnav-menu ul a:hover {
    background-color: rgba(5, 105, 105, 0.2)!important;
    border-radius: 50px;
}

    With the !important addition, but no luck. menu item 224 is “zakelijk – energietransitie”
    THX Freek

    October 11, 2018 at 7:07 pm #1020440
    Victoria

    Hi Freek,

    Best regards,
    Victoria

    October 11, 2018 at 9:31 pm #1020483
    Freek

    No. I want,when megamenu expands, to change hover over background colors for Some menu items. Now iT works the same for all items . So one color for menu item 1 and another bg color for menu item 2.
    Hope you understand what i mean. Thx Freek

    • This reply was modified 6 years, 1 month ago by Freek.
    October 15, 2018 at 2:59 am #1021345
    Vinay

    Hi,

    To add a different background for each menu item, first, right click and view the page source to find the menu item ID

    Then repeat the code pattern by changing the ID and background color for each menu item :)

    #top .header_color .main_menu .menu ul li#menu-item-632 a:hover {
    background: red;
}
#top .header_color .main_menu .menu ul li#menu-item-637 a:hover {
    background: gold;
}

    Best regards,
    Vinay

    October 15, 2018 at 11:07 am #1021496
    Freek

    Awesome. That did the trick. Thanks again. Freek

    October 16, 2018 at 4:51 pm #1022262
    Victoria

    Hi Freek,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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