Responsive Menu + Site Layout

jcostantini · May 2017

Hi,

I'm having a ton of issues on roseview2017.wpengine.com and your theme.

The menu does not shrink correctly and goes to a second line as seen in the link of the screenshot below.

http://sharedby.jamescostantini.com/1N0c422S0712

I could use some help here!

Thanks!

James

jcostantini · May 2017

I think there are issues with the responsive code for the app. Might need to manually change the size that it converts to the hamburger menu.

Also, fonts aren't doing a good job at scaling in responsive. Any idea why?

Bryan · May 2017

Hi, the responsive menu turn on 1240px width, you can set it in theme options>responsive>header under the initial width setting.
The font is very small, indeed. To fix this go to theme options>responsive>general and turn off font resizing. See screen: http://prntscr.com/f3xy08

jcostantini · May 2017

Hi,

Both options did not work, and the menu was already set to 1240px width.

http://sharedby.jamescostantini.com/0S22043Q1N1s

Turning off the responsive fonts makes the site look even worse. Any other thoughts?

Bryan · May 2017

Please look at these screens:
http://prntscr.com/f410l9
http://prntscr.com/f410te
The mobile menu triggers correctly at 1239px
When it comes to the font we do not really have much to say, it us just a font, you can try with another if this scales so badly.

jcostantini · May 2017

If I turn off responsive on the site the mobile version looks better, but the menu problem still exists.

http://sharedby.jamescostantini.com/0j1P26313g2d

jcostantini · May 2017

Once responsive is back on, the screen does not change correctly anymore... 1376 wide and it does not convert to handburger...

http://sharedby.jamescostantini.com/0t422f313d0k

Bryan · May 2017

Hey,
Please try to use this custom css, it will reduce the padding between each menu item by 5px so they will not break in responsive.

#Top_bar .menu > li > a span:not(.description) {
    padding: 0 15px !important;
  }

If you do not see any changes, clear browser cache.

Responsive Menu + Site Layout

Comments