Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • September 18, 2018 at 2:30 am #1011053
    rosewoodva

    Hi there,

    I have a side menu (imported from one of the demos).

    The submenu of “Accessories” is quite long, and doesn’t fit on the screen, so you can’t see half of the options. Is there a way to format this into two columns, or just raise it up so you can see all the options?

    Link: https://imgur.com/a/y9JVxKM

    September 18, 2018 at 6:53 am #1011110
    Rikard

    Hey Deanna,

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

    .html_header_left .av-main-nav ul {
    top: -200px !important;
}

    Best regards,
    Rikard

    December 17, 2018 at 1:50 am #1046108
    rosewoodva

    Hi Rikard,

    Thanks for your help, I tried this, and it worked for the regular submenu items, but then it totally corrupted the Mega Menu (which was previously the way I wanted it to look, using CSS).

    Mega Menu, desired look: https://snag.gy/3vR2Qs.jpg

    Issue with Menu dipping down below window space: https://snag.gy/U7iTVZ.jpg

    CSS fixes regular menu, but then Mega Menu looks like this: https://snag.gy/IqjguT.jpg

    Login info in private content, thanks!

    December 20, 2018 at 8:27 am #1047594
    Ismael

    Hi,

    Thanks for the update. I don’t see the issue described in the screenshot. Is this fixed?
    Best regards,
    Ismael

    March 1, 2019 at 5:45 am #1072878
    rosewoodva

    Hi Ismael,

    Sorry this issue is still not corrected. The submenu items after a certain amount do not get shown. They are below the bottom of the page. It works properly for the “All Products” Mega Menu, but not for any of the other menu items with submenu items.

    March 2, 2019 at 4:43 am #1073491
    Ismael

    Hi,

    We can move the sub menu container upwards with css, but I’m not sure if that is something you’d like to consider.

    .html_header_sidebar #top #header .avia_mega_div {
    top: -200px;
}

.av-main-nav > li > ul {
    margin-top: -200px;
}

    Another workaround is to remove the sub menu container including the mega menu and move the contained links onto a custom page, more like a category overview page with links to different areas of the site.

    Best regards,
    Ismael

    March 6, 2019 at 11:22 pm #1075694
    rosewoodva

    Hi Ismael,

    Thank you, this has resolved the issue for 3/4 of the menu items. We are still having issues with the “Accessories” menu item. Is there a way to force a column break point for this one only?

    Thank you!
    Deanna

    March 11, 2019 at 5:11 am #1077220
    Ismael

    Hi,

    Thanks for the update.

    We can’t split the sub menu items into separate columns, but we can use this css code to decrease the font size and padding of the menu items including the overall space between them, adjusting the overall height of the sidebar/header and in turn, moves the sub menu container upwards.

    .html_header_sidebar .logo {
    padding: 20px;
}

.html_header_sidebar #header .av-main-nav > li > a .avia-menu-text {
    font-size: 13px;
}

.html_header_sidebar #header .av-main-nav > li > a {
    padding: 12px 3px;
}

.html_header_sidebar #top .av-main-nav ul a {
    padding: 8px 15px;
    min-height: 18px;
    line-height: 18px;
}

    Best regards,
    Ismael

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