Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 31, 2016 at 6:02 am #575158
    rarch47

    I have done some customisation to my enfold header and given it a burnt orange background.
    The style settings in the theme options are obviously fairly limited to what they can actually achieve in finer type customisations.

    I want to know how I can customise the look of the small coloured border (about 2px high) that appears below the main menu when you rollover the buttons and also the one that shows the current page you are on. It also forms the top of the sub nav as well.

    I have tried to do it with custom css by targeting the .avia-men-fx class but it’s obviously not as simple as that. I just want to change the colour to one that contrasts better with burnt orange.

    Can you please help me?

    January 31, 2016 at 10:56 am #575210
    Josue

    Hi,

    Can you post the link to your website please?

    Regards,
    Josue

    January 31, 2016 at 11:02 am #575218
    rarch47

    http://ausidentities.coolwebs.com.au/ – right now its on my test build server.

    January 31, 2016 at 11:10 am #575223
    Josue

    Change your code to:

    .avia-menu-fx { background: brown !important; height: 3px; }
    January 31, 2016 at 11:28 am #575244
    rarch47

    Sorry, I should have posted the css code that I have already used.

    .avia-menu-fx { background: brown !important; height: 3px; }
.av_minimal_header .avia-menu-fx {display: block; }

    I did get it to appear but it only shows along the lenght of the parent link and doesn’t go across the complete width of the top of the submenu nav box that pops up – just like in the engold demo

    January 31, 2016 at 11:33 am #575254
    Josue

    Hey!

    It’s because you’re using the minimal header setting, you can try using this code to circumvent that:

    #top #header.av_minimal_header .main_menu ul:first-child >li > ul {
    border-top: 2px solid brown;
}

    Cheers!
    Josue

    January 31, 2016 at 12:49 pm #575287
    rarch47

    Ok, it works when I comment out:

    av_minimal_header .avia-menu-fx {display: block; }

    But it only works on items that have a submenu. It does not show under the current page item in the menu. Nor does it show when rolling over menu items that have no subnav.

    January 31, 2016 at 5:33 pm #575335
    Josue

    Hey!

    You need to use avia-menu-fx too, the code i posted only adds a border to the submenu, try adding this:

    .av_minimal_header .avia-menu-fx {display: block; background: yellow}

    Regards,
    Josue

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