Horizontal scroll issue: Site Scrolling Side to Side While Scrolling

Hi,

I’m having issues with the website in the mobile version. While scrolling up and down it also moves horizontally. However, when I pinch to zoom out it becomes static and does not move horizontally anymore. Is there any way to make it static in the first place?

P.S.: This is my first website which I initially cloned. I’m trying to figure out what is the issue by exploring existing topics but none of them helped my case. Hope you could find out what’s the issue and thank you in advance!

Here is my site Read-Only: [LINK][1]

You have that issue on all breakpoints actually.

It happens because some content is bleeding outside of the viewport, setting a general width for the page that’s wider than the viewport, hence the horizontal scroll.

Solution:
Select the Desktop breakpoint.
Select your Page Wrapper element and click on Overflow Hidden in the Style tab.
If it makes Sticky animations bug, then apply the overflow to the sections where there’s no sticky content. Otherwise let the overflow hidden on the page break.

Thank you for helping! It worked!

For anyone running into this issue still - there’s another way to fix this easily which won’t impact your sticky sections at all!

Basically, you need to set your wrappers to overflow:clip instead of overflow:none - this can be done using the custom properties feature :slight_smile:

Here’s a video tutorial:

Hello!

I’m making a web comic site. For Desktop, I’d like the intro title card to scroll vertically, then most of the comic to scroll horizontally, and then at the end, it reverts back to horizontal. I have it mostly working, but for some reason, the first few horizontal panels are not displaying. Any ideas or help are most welcome.

https://preview.webflow.com/preview/joes-radical-site-bf59bc?utm_medium=preview_link&utm_source=designer&utm_content=joes-radical-site-bf59bc&preview=a631f011c27723cb79eabb17486b1fc3&workflow=preview