I have a set of columns which is behaving strangely by not stacking properly on mobile view.
This screen shot is what it looks like:
and this is what it looks like if I zoom out to 90% in chrome (the way it should!):
what’s causing this strange behaviour?
Can you please share your project’s public link so it’s easier to understand your issue?
Learn how to do it here: Share a read-only link | Webflow University
Here it is, if you view it on mobile portrait the columns mess up.
I don’t know why but if you remove the padding on the “cat text”… div and add it to the text inside, you dont get the issue.
Thanks for that. I tried it out and it appeared to work but as soon as I had changed the padding on the third tile it started to break again.
I tried defining a percentage width for the text container rather than use padding and I got exactly the same behaviour. Doing the first 2 tiles fixes it but if you fix the rest it breaks again. The fact that zooming out within chrome makes a difference is even more baffling.
Any other suggestions?
EDIT:
I have fixed it by reducing the size of the padding, it works but it’s not ideal so a proper fix is still welcome
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
