I have a rendering issue on mobile with Grid I can’t get my head around.
When I working in the designer and checking on mobile view both in designer and with the rendering engine with Chrome Developer tools, what I see is fine :
However, one the published site, the layout is broken and elements in the Grid overlap with spacing being broken and text going all over the image :
Does anyone have a clue what’s could be causing this ?
Readonly link to project is here ttps://preview.webflow.com/preview/les-grands-gites-du-perigord-maquette-1?utm_medium=preview_link&utm_source=designer&utm_content=les-grands-gites-du-perigord-maquette-1&preview=d92a8990a0863928337cb075b1c298bf&pageId=5ef74bcbd727ea07c23ff827&mode=preview
I’m not able to see your screenshots so unfortunately I’m not sure what issue you’re seeing on your end. I am noticing that your sections could use some adjustment for the larger-end of the mobile breakpoint (as shown below) and confirmed it looks similar in the Designer:
Thanks for taking the time looking into this mate, that’s much appreciated. We’ve narrowed down that the problem is iOS specific, so if you check this on Android, you won’t see it.
As it looks to be a Webflow product issue, the Webflow support team have picked it up and are looking into it. I’ll let you know what the outcome is.
But thanks again for taking the time to look into this.
So just in case someone faces the same problem at some point:
Webflow support found out that the class used was somehow corrupted. Removing the class and creating a new one (even with identical settings) solved the issue.