Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 2, 2017 at 6:57 am #741573
    mcraig77

    Ahoy,

    How do I change the color of a Colored Menu Button and text inside – both hover and normal? Anyway to make the button have rounded edges?

    February 3, 2017 at 7:21 am #742194
    Rikard

    Hey mcraig77,

    Please try the following in Quick CSS under Enfold->General Styling:

    #menu-item-1107 a {
    border-radius: 5px;
}

#menu-item-1107 a span {
    color:red;
}

    Best regards,
    Rikard

    February 3, 2017 at 10:03 am #742305
    mcraig77

    The boarder worked great, the color didn’t.

    Please Advise

    February 3, 2017 at 10:58 am #742323
    Guenni007

    hi rikard – i think he liked to colorize the background and the font-color –
    so mcraig77 try this ( btw. if a rule does not work allways try to put in !important after the rule)

    .main_menu #menu-item-1107 .avia-menu-text {
    background-color: red !important;
    color: #000 !important
}

.main_menu #menu-item-1107 a:hover .avia-menu-text {
    background-color: blue !important;
    color: #fff !important
}

    PS the span has that class avia-menu-text (span should work too)

    if you like to have round corners with border: (btw. you see you can manage each corner separately ! top-left top-right bottom-right bottom-left)

    .main_menu #menu-item-1107 .avia-menu-text {
    border: 2px solid #fff !important;
    border-radius: 15px 10px 5px 0 !important;
}

    if you do not do it with .main-menu the responsive menu does the same – and this could look ugly.

    February 3, 2017 at 3:00 pm #742382
    Vinay

    Hi,


    @Guenni007     Thank you for the solution as always :)

    Let us know if you have any questions, we are happy to help!

    Best regards,
    Vinay

    February 3, 2017 at 8:52 pm #742575
    mcraig77

    Hello Gents,

    For some reason this isn’t working on my end. I added it but nothing… Is it stlil showing up as orange…

    February 4, 2017 at 12:50 pm #742802
    Nikko

    Hi,

    I can’t find Guenni007’s code in your css file (you can see it in the link below). Have you removed it? or it’s still there just not reflecting on the site? If it’s the latter, please give us temporary admin access, so we can check why it’s not showing up.

    Best regards,
    Nikko

    February 6, 2017 at 11:26 pm #743632
    mcraig77

    So I got Guenni007’s code to work, thanks! I noticed thought the css for the boarder does not change… How do I have different color boarders for normal and hover?

    February 7, 2017 at 2:33 pm #743917
    Guenni007
    #top .main_menu #menu-item-1107.av-menu-button a .avia-menu-text {
    border: 2px solid #fff !important;
}

#top .main_menu #menu-item-1107.av-menu-button a:hover .avia-menu-text {
    border: 2px solid #f00 !important;
}

    be aware that on #menu-item-1107.av-menu-button is no spacebar between 7.a

    February 9, 2017 at 5:45 pm #744920
    mcraig77

    Thanks!

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Menu Button Colored Styles’ is closed to new replies.