Page showing up in half the width of the screen on mobile

Hey - I created a mobile variant of my website in plasmic starting with the iphone 11 pro max dimensions option. When I open my site on my phone, it only occupies half the width of the screen. Do you know what the issue might be? Thanks in advance.

Usually this is due to some element on the page being set to a fixed width that’s too wide for iPhone screens

Ideally you can find what element that is. Setting overflow-x to be clipped on the page root element is also another a blunt way to paper over this.

Let me know if this helps / if you can find it

Thanks - will give that a shot. Appreciate the help.

Hi - this is the page: opapp.io. I wasn’t able to find what was causing the issue. Could it maybe be the Antd collapse component that I’m using?

On setting the overflow-x to be clipped - I created a class in the code (in the css file) that has this style on it and then set the class name html attribute on the mobile root to be equal to the css class name. I guess this is not the right approach? Thanks.

Made a short video on how to find these!

Wow - thanks man.