Docs

[M Irfan]

Dear Themeco,

I am trying to use UberMenu in my site but:
1. the NavBar search appears off-place, below the ubermenu
2. there is a gap between the ubermenu and the bottom of my header, so hovering the menu makes the pop-up box covers my sitename/logo

Would you be able to provide some styling help to integrate the ubermenu correctly? I will provide site details.

Thank you.

[M Irfan]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in!

#1. You can add this under Custom > CSS in the Customizer.

.menu-item.x-menu-item.x-menu-item-search {
  display: inline-block;
  margin-right: 10px;
  margin-top: 12px;
}

#2. Use this :

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

You can change the value to reduce the spacing if needed.

Cheers!

[M Irfan]

Hi Rupok,

Thank you, it works as intended in desktop view. However it still doesn’t show correctly in mobile view. Would you be able to help?

Best regards

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

@media screen and (min-width: 979px) {
.ubermenu-responsive-default.ubermenu-responsive .ubermenu-item-level-0 {
    width: 33%;
}

.menu-item.x-menu-item.x-menu-item-search {
    margin-left:20px;
}
}

Hope that helps.

[M Irfan]

Hi,
Thanks for the reply.
I tried it on Safari in iOS but the menu still covers my site logo/name. Any help?

Best regards

[Christopher]

Hi there,

Please add this code :

@media (max-width:979px){
.ubermenu-skin-vanilla-bar.ubermenu-responsive-toggle {
    overflow: hidden;
}
a.x-brand.text {
    width: 100%;
    display: block;
    text-align: center;
}
}

Hope it helps.

[Author]

Posts