I’m new to Webflow, so far just playing with it, and I must say so far so good.
I’m also not a pro web designer by any means, so I beg your pardon if this question is somewhat dumb, but I could not find an answer on the web.
Basically, as the title says, the images don’t display on a mobile device as they should. At least Chrome’s developer tools an Webflow’s built in mobile simulators show that everything should be ok on a smaller screen, but everytime I see whitespace where the images should be.
Anyone got an idea what might be causing the problem?
Oh, by the way, it’s not a file size thing. I’ve seen on the web that a similar problem might be caused by files being too large, so I compressed them. I’ve tried compressing them even harder then they are now, and still no luck, so I returned to the point where all files are smaller (most of them much smaller) than 250kb, which is said to be a sort of limit for mobile devices (though I doubt it, cause I remember loading huge images with my phone, much larger than ones that I use on my website).
Ok, any help would be much appreciated
Cheers,
Jon.
Still, I don’t see why would one device treat image correctly, and the other wouldn’t.
I mean, I’ve checked on multiple iphones, not just mine, so it’s not a device issue.
I finally found the culprit. Your images weren’t loading on Safari even on Desktop.
Seems like some browsers are ignoring percentage-based height values.
So, the images will appear when the percentage value is removed or replaced on the picRow element.