Viewing 23 posts - 1 through 23 (of 23 total)
  • Author
    Posts
  • May 21, 2014 at 8:00 pm #268168
    thanp73

    is there a way to set a different bg color for the main menu than the header bg color?

    • This topic was modified 9 years, 11 months ago by thanp73.
    May 21, 2014 at 8:24 pm #268183
    Josue

    Hey!

    Try adding this code to the Quick CSS:

    .main_menu {
    background: red;
}

    Cheers!
    Josue

    May 21, 2014 at 8:38 pm #268186
    thanp73

    No effect… yes, refreshed cache and pages.

    any oteher ideas?

    May 21, 2014 at 8:43 pm #268187
    Josue

    Hi,

    Can you post a link to your website please?

    Regards,
    Josue

    May 21, 2014 at 11:00 pm #268286
    thanp73
    This reply has been marked as private.
    May 21, 2014 at 11:06 pm #268295
    Josue

    You can put your custom CSS here directly:
    http://www.astfinance.com/wp-content/themes/enfold-child/style.css?ver=1

    Best regards,
    Josue

    May 21, 2014 at 11:07 pm #268298
    thanp73

    hah- like I said, it take a long time for css to take effect. now it’s red.
    however, now the bg of the main menu is red but not of the bg of the dropdown area

    I am looking for the opposite effect here- the bg of the main menu items same as the header, but the bg of the dropdown and megamenu areas different…

    using firebug I can’t seem to identify what class the bg of the menu areas is classed as, because it goes away as son as I take mouse away.

    also, when using your inbuilt header textures/ images, that image does not repeat down into the mega menu items… just FYI.

    • This reply was modified 9 years, 11 months ago by thanp73.
    May 21, 2014 at 11:11 pm #268300
    thanp73

    how is that different than quickcss?

    also, it’s not changingthe bg color of the megamenu dropdown areas, which is what I DO wantt o change…

    thx!

    May 21, 2014 at 11:16 pm #268306
    thanp73

    using firebug I got it to change here, the a89b99 is something I typed in-

    but I don’t know how to pu this into the quick or style.csss….
    thx!

    .header_color .header_bg, .header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div {
    background-color: #A89B99;
    color: #544E34;
    }

    May 21, 2014 at 11:17 pm #268307
    Josue

    The difference is that it will updated quicker, to change the background in the sub menus:

    .main_menu, .sub-menu *, .sub-menu {
    background: red !important;
}

    Best regards,
    Josue

    May 21, 2014 at 11:19 pm #268310
    Josue

    Have you tried doing it via FTP (edit style.css) or Themes > Editor?

    May 21, 2014 at 11:26 pm #268315
    thanp73

    I am trying to get the menu itself same as header, and bg of the dropdowns to be different.
    now, all menu is red- both the main links, and the mega menu items that open up

    I tried what seemed logical, removignthe main_menu, portion of your code, and putthis in the child style.css, but it’s still all red.

    gettign closer!
    .sub-menu *, .sub-menu {
    background: red !important;
    }

    I

    any ideas isolating just the mega menu background area?

    May 21, 2014 at 11:29 pm #268317
    thanp73

    actually just noticed too, that made the bg of the other menu location up in the header red too, which I definitely do not want.

    I undid both the quick and the style.css, back to square 1

    May 21, 2014 at 11:31 pm #268319
    Josue

    Have you tried prefixing the .avia_mega_div class?

    .avia_mega_div .sub-menu *, .avia_mega_div .sub-menu {
background: red !important;
}

    That way it will only target mega menu elements.

    Regards,
    Josue

    May 21, 2014 at 11:44 pm #268333
    thanp73

    that got it! thanks!
    I changed red to #fffff and it’s lovely!
    thanks for your help!

    May 21, 2014 at 11:45 pm #268335
    Josue

    You are welcome, glad we could help :)

    Regards,
    
Josue

    May 21, 2014 at 11:48 pm #268339
    thanp73

    wait a minute
    I lost the mouseover effect now

    May 21, 2014 at 11:49 pm #268341
    thanp73

    so the color that used to appear when cursor was on an avia sub. menu item is now lost

    May 21, 2014 at 11:52 pm #268343
    Josue

    I see why, try with this code instead:

    
/* Idle */
.avia_mega_div .sub-menu, .avia_mega_div .sub-menu a{
background: red !important;
}
/* Hover */
.avia_mega_div .sub-menu a:hover{
background: peru !important;
}

    Change as needed.

    Regards,
    Josue

    May 22, 2014 at 12:08 am #268357
    thanp73

    ok great- thanks, I think that got it- much apprecited.

    while we are on the topic, is there a way to isolate the hover background color element of the sub nav menu to the right of my phone #? the about us/ contact us?

    May 22, 2014 at 12:13 am #268360
    Josue

    Hi!

    Try with this:

    #avia2-menu .sub-menu li:hover a{
    background-color: blue !important;
}

    Cheers!
    Josue

    May 22, 2014 at 1:07 am #268367
    thanp73

    that’s the ticket- thank you!

    May 22, 2014 at 1:21 am #268376
    Josue

    You are welcome :)

  • Author
    Posts
Viewing 23 posts - 1 through 23 (of 23 total)
  • The topic ‘set background color of avia mega menu to different color than header’ is closed to new replies.