Shape 5

I am having format issues w/ an Ipad Pro 9.7 (1024 X 768 Portrait) (see attached) - the menu does not show at all and modules are pushed together

Thoughts?

Hello,

I don't really know what I'm looking at in this picture. I need an exact url to where this can be seen.

Modules are supposed to re-position on smaller screens. If you're using the columns they would position under each other so that they become one column on smaller screens.

Your menu is most likely to big and therefore can't all show on small screens. I would recommend reducing the size of your menu, but if that's not an option you can increased the Trigger Width setting under Main/Responsive Nav for when the mobile menu appears.

Hello,

Actually I can see on your homepage that you're using "large_picture" classes, which are not designed for this template. They were used with another template and would require custom css work to integrate into another. There is css in the responsive css files that need to be adapted for this template. That large image is meant to re-position and hide on smaller screens, and none of that css was transferred over. That is what is causing the overlay issue.

The URL is on the screen shot.  If you look at the website in pretty much any other browser or device, it works fine.  The menu should show as a hamburger menu and the logo should show (again, it works all other devices and browsers)

Hello,

It's as I stated above, you are using code that is not designed for this template.

Your menu is hiding because you have custom_1 set to hide too early with hide_900. The hide class needs to be the same as your mobile trigger width so that the menu is set to hide at the same time as you are hiding this content.

Can you point out to me what custom code I am using?

- The only reason I'm using "class=hide_900" in Custom_1 is because if I don't there's a large blank space on mobiles devices where the video normally shows

- As far as the menu hiding..when it hides shouldn't a hamburger menu appear like it does on all other mobile devices/phones ?

- As far as "large_picture" classes, where do you see that?  I didn't think I modified anything other that the actual images and text in your demo module.

Hello,

"The only reason I'm using "class=hide_900" in Custom_1 is because if I don't there's a large blank space on mobiles devices where the video normally shows"

----Yes, but you are calling it before the mobile menu triggers so it causes everything to move up. You need to change the time it triggers.

"As far as the menu hiding..when it hides shouldn't a hamburger menu appear like it does on all other mobile devices/phones ?"

----It does show on your site, but there's screen range where it won't show because of the issue above, you need to change the trigger call.

"As far as "large_picture" classes, where do you see that?  I didn't think I modified anything other that the actual images and text in your demo module."

----Sorry I was looking at the wrong template, I was looking at Curb Appeal for some reason. This is the correct issue. The issue is that the text on the left side of the picture in the "What is HAKI SAKI?" section is taller than the image. That text is position:absolute called until it hits about 970px screen width and as the screen shrinks it becomes taller than the available area, which causes it to overlap the text below it. The main issue here is the amount of text or the height of the image. I would recommend either reducing the amount of text, or if possible can you use a taller image to the right of it? Either one of those would fix the issue. The only alternative is that we change the css for this area so that the pictures stacks on top of the text at a larger screen resolution, but that is meant for tablet size and mobile sized screens.

OK, I will play with that module to see what I can do.

As far as when the mobile menu triggers, where can I find some further explanation on how to change that?

Thanks.

Hello,

You can change the mobile trigger width in the location I mentioned above:

"Trigger Width setting under Main/Responsive Nav"

There's a field there where you can adjust the screen width for where the mobile menu appears.