[Support request] New Container Has Overflow on Mobile

[Nick]

Hey Team,

The new containers are showing up way too wide on mobile devices for me. Even though I’ve got the max width set to 800px and width set to 800px, it’s still showing a wide overflow on the right side for containers I’m building now.

The legacy ones are fine, not the new ones.

I also tried stetting max-width to 100% and the same issue. The whole screen scrolls left to right on mobile even though overflow is set to “Default” (I also tried testing all other forms of overflow).

Please advise.

[Leo]

Hi there,

Any chance you can link us to the page in question?

You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Let me know 🙂

[Nick]

I’ve realized that you have to set “Max Width” now and not just “Width”. If you set width to 900px it will scorll left to right.

[David]

Hi there,

thats correct.

if you use a fixed unit such as Pixels px with the Width property then you must ensure the value is not wider than a) the browser viewport and b) its not wider then any container it sits inside of. Otherwise it overflows.

Instead use a responsive unit eg. 100% with Width and set the Max Width to Constrain it.

[Nick]

Awesome thanks David!

[David]

You’re welcome

[Author]

Posts