I’m having a super weird/annoying issue, which I can see from looking through the forum others have also had, but I can’t figure out how to fix it.
In our CMS project pages, the images on mobile (iOS) aren’t always showing. For example, on xforwhy - Zoe Curtis Modern Crochet there are 2 square images next to each other. They show without any issue on desktop, tablet & iPhone landscape, but as soon as you look on iPhone portrait, the left-hand square image isn’t showing. The landscape image under the 2 squares is also not showing in iOS, and neither is the final landscape image.
The weirdest thing about this issue is that it’s not repeatable over all the CMS pages. On some of the project pages, the square images are all showing, on some, none of them are. And then in some cases, they may show, and then after a refresh (but no changes in the design view), they suddenly disappear. So it’s super hard to recreate the issue to get to the bottom of it.
Things I have tried:
- Setting Width & Height of all images & containers to 100%
- Setting max Width & Height of all images & containers to 100%
- Trying VW & VH instead of %
- Setting % size just on images
- Setting % size just on containers
- Changing loading to eager instead of scroll
- Changing the Grids to flexbox vertical
I am at a total loss of how to fix this - please help!