Logo behavior

Support
#1

Hi,

I am facing a problem with the behavior of my logo.

If I reduce the size of the internet window, when the left end of the logo meets the logo, the logo slides above the menu while it should transform into a mobile menu (as in here http://demo.theme.co/integrity-1/).

How do I set up the logo to do the same?

Thanks

#2

Hi There,

Please add the following code to Theme Options CSS

@media(max-width: 1200px) {
.x-navbar .desktop .x-nav > li > a:not(.x-btn-navbar-woocommerce) {
     font-size: 8px;
}}

Hope it helps!

#3

Hi,

Thanks for your reply. That is a fix but it is not what I am looking for. I’d rather see the menu going mobile as soon as it “hits” the logo (as it is the case on your demo).

Looking forward to your reply

#4

Hello There,

Thanks for updating in! In our demo, when the screen is below 980 pixels, the mobile menu kicks in. This is the default in all our demo site and in the X theme in your site. The difference between our demo and your site that they have a difference in menu width. Your menu width is wider than the demo site. I would recommend that you shorten your primary menu items by having other items as a sub menu of the another item if possible.

Hope this helps.

#5

Thanks for your answer.

I’ve added the piece of code but the look is not that good.

Where could I change the trigger of 980 pixels for the mobile menu to kick in?

Thanks

#6

Hi There,

You can add the following code

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

Hope it helps!

#7

Thanks, that is better!

#8

Glad we could help.

Cheers!