Site loading wonky on mobile

Hi,

Does anyone know how to fix this issue where the website loads on the side? Every page is like this. This happens when using the Chrome app on an iPhone, the website loads fine on an iPhone Safari.

Thank you

I have encountered this behavior in Chrome under two conditions:

  1. If there is some element on the page that has a fixed width that extends outside the confines of the body. (For example, a line of text that is set to no-break, causing it to be wider than the body.

  2. Sometimes I’ve found the Animations can cause this behavior. It could be a bug in the AOS library, or just an issue with Chrome and AOS.

To diagnose issues like this, I would start by removing animations from components one-by-one until they’re all removed. If the issue stops after a particular animation is removed, that’s the culprit. If it persists after all animations are removed, start hiding sections of the page until you find the part with the offending component.

1 Like

Your news letter component has an animation that goes off the screen on mobile, select the container it is in and apply the class overflow-hidden

1 Like

Thanks for your both of your suggestions. I tried the overflow-hidden one first, very relieved that worked. Cheers!

1 Like