I’m running into some final issues on the new website I’m launching. I’m trying to make the projects on the homepages perfect squares on mobile, and looking at it in webflow it seems correct. However, if I publish my website and take a look at it on my mobile phone (Iphone 7), it looks stretched, like in the image below.
I’ve checked all the elements but can’t seem to find the issue. Can anyone see where the issue is?
It’s because for the other ones you have a background image set for the link block which will never stretch but that particular link, you have an image in there which has a height and width set which will stretch it.
@Jorik - This could be related to using a grid in this case. Sometimes it’s best to copy your element(s) to a blank page, with no interactions, to test design options and work out issues. You might consider laying out those elements with flexbox since it looks like a simple grid. I don’t have the time at the moment to be more helpful.