Header sizing issue, reopen post

I am still trying to resolve the issues at the bottom of this post but due to work constraints was unable to continue the conversation before being locked. https://theme.co/apex/forum/t/make-header-menu-hover-over-slider/25811/17?u=fnbit

I am unable to resolve the header sizing issue on mobile or the menu extending into the header. If I followed the instructions incorrectly let me know or how I can resolve these last two issues. Thanks

Hi There,

Thanks for responding again to the thread.
I can see all of your desktop view issues have been resolved and you only have the header issue on mobile.

Please find this to resolve the mobile view issue.

@media (max-width: 767px) {
.x-navbar-inner {
    min-height: 102px !important;
    background-size: 100% !important;
    padding-bottom: 7px !important;
}
.x-btn-navbar, .x-btn-navbar.collapsed, 
.x-btn-navbar.collapsed:hover {
   font-size: 16px !important;
   color: #fff !important;
}
.x-btn-navbar {
    margin-top: 63px !important;
}
}

Hope this is something you are looking for.

Thanks

That worked, thanks!

Last issue I have is the top menu extending upwards past the visual buttons. See attached…

Thoughts?

Hey @fnbit,

You have this CSS

.x-navbar .desktop .x-nav > li > a {
    height: 47px;
    padding-top: 142px;
}

Change the padding to 0 or remove it and change the height to auto. Then, add this CSS

.x-navbar .desktop .x-nav>li {
    margin-top: 142px;
}

Please note that we guiding you with some customization here in hopes that you will learn how to code and maintain them from here. Issues that would arise from the use of custom codes and further enhancements would be getting into custom development which is outside the scope of our support.

If you will be building a header which could not be done with X out of the box, please consider switching to Pro which has a header builder. Otherwise, you will need to hire a third party developer.

Thank you for understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.