Docs

[Adam K]

Is there a way to have submenus move up? I have a full-screen Revolution Slider above the masthead and have subtracted the menu height from the slider so that it shows when the page loads. Some of my nav menu items have drop-downs, but when you mouseover, you can’t see it. Demo site example at http://2016.sundachicago.com/ Any suggestions on how to fix this? Thanks!

[Prasant Rai]

Hello Adam,

Thanks for writing in!

You can add this under Custom > CSS in the Customizer:

.desktop .sub-menu{
    margin-top: 4px;
}

Thanks.

[Adam K]

I don’t believe you understood my issue. Please visit the page that I referenced, http://2016.sundachicago.com/ , and do not scroll down. The menu will show at the bottom of the screen. There is a nav item, “About” that has a submenu. When you mouseover “About”, you’re unable to see the dropdown since it extends below the viewport. Have you helped anyone with this in the past? I’d like it to function like typical multi-choice dropdowns do, extending up if the menu is on the bottom of the screen. If you have any questions about what I’m hoping to do, please let me know. Thanks!

[Friech]

Hi There,

Sorry for the confusion. You can add this under Custom > CSS in the Customizer instead.

.x-navbar-wrap .x-navbar .desktop .x-nav > li ul {
    top: -70px !important;
}

Feel free to adjust the -70px value.

Thanks.

[Adam K]

I understand the ability to adjust that. If I position it at -70px, once a user has scrolled down they will not be able to see the submenu on hover…as it will be above the viewport. I’m hoping for a fix where it will extend up or down based on where the user is on the page.

[Darshana]

Hi there,

Further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding.

[Adam K]

I would disagree and say that this is a problem with the theme. It does not display dropdown menus correctly when you use a feature of the theme…having a slider above the masthead. That having been said, I was able to get it working properly by adding the following code to the page in question.
.x-navbar-fixed-top .desktop .x-nav > li ul {
top: 65px !important;
}
.x-navbar .desktop .x-nav > li ul {
top: -83px;
}

[John Ezra]

Hi there,

Thanks for updating the thread, your feedback, and for sharing your solution. We’re sure it will help others who may be looking for a similar solution.

Thank you so much for your support and understanding. We apologize if there are certain requests that we are not able to accommodate.

We hope you have a wonderful day!

[Author]

Posts