Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1019539

    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

    #1019765

    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

    #1019825

    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

    #1020440

    Hi Freek,

    Best regards,
    Victoria

    #1020483

    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, 2 months ago by Freek.
    #1021345

    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

    #1021496

    Awesome. That did the trick. Thanks again. Freek

    #1022262

    Hi Freek,

    Glad we could help :)

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

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