logo and menu items overlap

[juliewaterhouse]

As you resize the browser width-wise, the logo moves closer to the menus, until there’s a point at which the logo overlaps the left-most menu item, before it gets narrow enough that the menu collapses into the mobile menu.

It’s easy to see this by visiting http://107.170.101.150 and slowly narrowing the browser window. Happens in Safari, Chrome and Firefox.

I do have custom CSS as follows, but I have removed it and tested, and the issue still happens, so this CSS, at least, is not affecting it.:

#header {
  padding: 50px 20px 0px 0px !important;
}

Thanks for any insight you may have on how to fix this!

~Julie

[Kyle – SUPPORT]

Hi

Please follow this thread: http://support.swiftideas.net/forums/topic/how-to-switch-to-mobile-menu-when-overlapping-with-logo/

– Kyle

[juliewaterhouse]

Thank you Kyle! That CSS worked perfectly for me. Much appreciated.

~Julie

[Kyle – SUPPORT]

Great! No problem

– Kyle

[juliewaterhouse]

Hi Kyle,

Sorry, I’ve just discovered that there’s a bit of a problem with this solution.

If you visit http://107.170.101.150 and slowly narrow the browser window, the menubar does switch correctly to the mobile style at the point where I’d like, but at the exact point when it does, the menu doesn’t actually work when clicked. If I keep resizing smaller, there seems to be another breakpoint where the menu starts working again.

Another way to observe this is to resize the window quite narrow (to a point where the menu works), then click the mobile menu to activate it. While it’s open, resize the window slowly larger again. At some point, you’ll see the menu items down the side disappear. It’s in this range, from that point until the regular menu re-appears, that the mobile menu doesn’t work.

Tested on a variety of browsers with the same behaviour.

I’m using the exact CSS form the thread you referenced earlier, with 1200 as my breakpoint.

Would love some help! 🙂

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-
#mobile-menu-wrap {transform: none;display: block !important;}
Thanks 🙂
With Best Regards
Mohammad

[juliewaterhouse]

Thanks very much, Mohammad! That did the trick.

~Julie

[Rui Guerreiro – SUPPORT]

Great. Thanks Mohammad
-Rui