Site logo

Archived topic

Horizontal scroll on mobile

15 replies · Started by Dan on August 27, 2020

Viewing posts 1–15 of 16

on the mobile version of the site there is an horizontal scroll which I can't wrap my head around.
Don't understand where it's coming from.
Using Gutenberg and GP blocks.
This is a temp url:
http://dd0ab622208e.ngrok.io/

Any ideas?

Thanks!
Dan

Hi there,

The URL isn't working for me.

Can you double check?

Hi, I am having the same exact issue. Have checked all the site settings. On some pages, the mobile version has a horizontal scroll. The site is http://www.green-waves-coaching.de (it's on the home and about me page. The others seem to be fine.)
How can I fix that? I am using the GP premium with elementor.

Hi there,

looking at the Home page you are using the Elementor Stretch section option to make the full width.
Which is not a great option as it uses JS to recalculate the width of the element.

I would suggest you remove the Stretch option.

And enable the GP Page Builder container to Full Width for the pages you're using a pagebuilder on:

https://docs.generatepress.com/article/page-builder-container/

I’ll upload the site to the server so you can take a look.

Dan

Thanks for the fast reply! I don't seem to have the option. I can only set the container width to a fixed no of pixel. In the menu there is just "container" but not "page builder container". Do I have to enable any other settings in GP so I can get this setting option?

Thanks Dan - let us know where its available

Nadine can you raise a new topic where we can address your issue directly.

Ok, I found it on the specific site settings. I was looking at the general Customizer options. I changed the setting according your suggestion. The issue still exists.

Nadine, you need to edit each of your Elementor Sections and in the Section Settings disable Stretch Section

Hi David,
I've uploaded the site:
https://www.agrobee.co.il/

On mobile (or using the chrome inspector) you can see there is a gap on the left hand side.
I am not using any page builders, just GPP and GP blocks.

Thanks
Dan

On some of your Grid Columns you have 30px left padding. You can set this to 0 in the Settings for Mobile. Or instead of using padding on the inside of the Column i would suggest increasing the vertical column gap on the Grid parent.

Let me know.

Thanks David, that solved it.
I would think that the mobile grid would reset it's columns padding to 0 to avoid these kind of issues.

Appreciate your help.

Dan

Hi David,
thank you, did so, but still... it seems only to be on pages which have a disable - show page image. that's the only thing I could find that they have in common.
Best regards
Nadine

This archived topic is closed to new replies.