[PicciaNeriParticipant]

Hello, thanks to this wonderful forum I found out how to display the menu always as burger menu, even on larged width:

@media (max-width: 2440px) {
.x-navbar .desktop {
display: none !important;
}
.x-navbar .x-btn-navbar {
display: inline-block;
float: right;
}
.x-nav-wrap.mobile.collapse.in {
display: block;
}
.x-nav-wrap.mobile.collapse {
display: none;
}
}

However, now the expanded menu items go across the whole screen. How do I correct this? Also, when reducing the windows the logo and burger menu lose all margins. How can I fix this?

This is the dev site I am working on
http://dev.a-i-r.co/

Many thanks in advance for your help.

[RupokMember]

Hi there,

Thanks for writing in! You can add this code too to control the container inside the Navbar :

.x-navbar-inner .x-container.width {
  max-width: 1500px;
  width: 90%;
}

Hope this helps.

Cheers!

[PicciaNeriParticipant]

Hmmm not quite – still veeeery long across the width of the page, see attachment. How do I get the expanded menu items to just be say 200px wide? And still align to the right?

thank you so much as usual!

Piccia

[PicciaNeriParticipant]

…I seem to have found a solution:

.x-navbar .mobile .x-nav {float: right;}

Thanks! all done 🙂

[ThaiModerator]

Glad you’ve sorted it out.

If you need anything else, please let us know 🙂

[Author]

Posts