Streaming live at 10am (PST)

Trouble with iPhone layout

Hi, I am currently formatting my webflow website for iPhone and am having a few problems, which I will outline below:

Here is the website link:

  1. one of my images (that appears on a regular website browser on desktop) does not show up at all on the iPhone. The picture that is not showing up is the image of the heart pendant with the text ‘Charmed Collection’ below it. I have included a screenshot of the page where the image doesn’t show up below:

  1. some text on home page (our Phone Number) randomly appears blue on my iPhone, though the class style on webflow shows it black and no underline. It appears black on desktop version. It is not a text link, so no idea why that is happening:

  1. Some images aren’t formatted the same way they appear in the webflow ‘phone layout’ on my phone. For example on the screenshot below, the Webflow layout appears to have two columns of square product images all the same size (how I want it). On my iPhone 6 it only displays one row and the image sizes are all inconsistent.

Thanks for the help!

Your first image “banner” makes a mess in the layout because it’s not constraint in a “div block charmed” like the other. As this is the “divblockcharmed” that have the size of 345 pixels, the “banner” doesnt respect the grid. So put the banner in the same div than the others and maybe optimize that image because it’s 650ko :wink:

On my iphone landscape I have two columns a bit jiggy because of the 1st image, on portrait it seems quite ok. If you fix the first image the rest should lokk on phone like on webflow.

1 Like