Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • March 22, 2019 at 6:57 pm #1081973
    gatehealing

    re: https://gatehealing.com/
    I know this is possible as I see it on another Enfold site, but using inspector I cannot figure out how to select the option. Looking in documentation, all I found was this:

    /* Top Bar Link style on hover */
    #top #header_meta li.menu-item:hover a {
    color: gold;
    text-decoration: none;
    }

    But that does not seem to do anything, and there is no reference to what options there are for ‘text-decoration’ other than the ‘none’ that is in the code.
    All I am looking for is a line under the menu item that is being hovered over (not for the deeper sub menu items, just those top ones that you see).

    I may have missed it, but I looked all over the Menu documentation and in the Enfold settings sections to no avail.

    Thanks
    Jon

    March 25, 2019 at 1:37 pm #1082652
    Victoria

    Hey gatehealing,

    Can you please disable the caching plugin and share credentials with us. There might be an error in Quick css and we would like to check.

    Best regards,
    Victoria

    March 26, 2019 at 3:33 am #1082944
    gatehealing

    Sure. Cache plugin is off and login creds in private box

    J

    March 29, 2019 at 3:13 am #1084406
    Ismael

    Hi,

    Thank you for using Enfold.

    This css code should display the menu-fx container or menu underline on hover.

    .avia-menu li:hover a .avia-menu-fx {
    position: absolute;
    bottom: -1px;
    height: 2px;
    z-index: 10;
    width: 100%;
    left: 0;
    opacity: 1;
    visibility: visible;
}

    Best regards,
    Ismael

    March 29, 2019 at 3:50 am #1084441
    gatehealing

    I cleared my browser history/cache etc. and pasted the code exactly as it is in your code, but it didn’t do anything. I’m using Chrome browser.

    Could any of the other quick css be getting in the way? Y’all have my login creds in the private data from my last response if that would help.

    J

    March 29, 2019 at 3:57 am #1084448
    gatehealing

    Nevermind. I got it fixed.

    Thanks!

    March 29, 2019 at 4:06 am #1084450
    gatehealing

    So now the question is this: If you visit my site, gatehealing.com , you’ll see that the line is below the top separator line for the breadcrumb/page-title area. I played with the code and could not get it to move up. I had gotten code when I first purchased the template to get rid of the line because we had moved the main menu down a little, and altered the breadcrumb line height. That’s why the code you provided didn’t work at first. Once I removed the code to remove the hover line, I didn’t need the code to put the line in, but I tried putting it back to attempt to move the hover line up . . .no luck.

    March 29, 2019 at 4:10 am #1084452
    gatehealing

    I have removed the code for moving the main menu down, and changing height of breadcrumb line to no avail either.

    March 31, 2019 at 10:26 pm #1085189
    Ismael

    Hi,

    Try to set the bottom position value of the avia-menu-fx container to 13px.

     bottom: 13px;

    And pull the sub menu container upwards using this css code.

    .av-main-nav ul {
    margin-top: -15px;
}

    Best regards,
    Ismael

    April 1, 2019 at 8:01 pm #1085682
    gatehealing

    AH! That seems to do it!

    Thanks again!
    Jon

    April 2, 2019 at 9:53 am #1085983
    Nikko

    Hi Jon,

    We’re glad that we could help :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Main menu, color underline when hovering (like the one that is present on active’ is closed to new replies.