Full width mobile images

Hi guys,

I’m trying get full width images to work in mobile view. When I preview in blocs or preview via the browser, the images look fine and fit both xs and iPhone 8+, but when I upload to my server the images look to be reduced in size with a border.

I’ve tried various resolutions, made the bloc full width and removed the gutters.

Any ideas?

Hi @DaveC
after upload you see on all smartphones a border ? When I look on my iPhone X I don’t see an border… Image is full width …
tom

1 Like

Disable gutters from the rows that contains the image and the descriptive text. Oh wait… you tried that. Hm… I just setup a bloc with the image of yours and the text, removed gutters and it showed as expected.

Do you use any classes that might prevent that?

1 Like

There is a class but only to remove the top padding out of the column.

The images are edge to edge on my iPhone 10?

Casey

1 Like

This what I see in Blocs preview

This is what the preview server shows me

This what I get on an iPhone 7, 8+, 10 etc

Only the mobile shows borders, at least for myself and my colleagues.

Have you set gutters in to the rows in all breakpoints?

Gutters can’t be enabled or disabled for each breakpoint.

1 Like

I do wonder… you want the white space around the images on the other breakpoints? Have you thought about adding them as a background image for the containing column? That way they could take up the fully width and height of the column.

Right, my mistake…

I had thought of that. I’ve set it up as two separate blocs, one for just mobile full-width, then one for the other breakpoints as two column layout.

I’m seeing them full width on iPhone XR

1 Like

Seems to work for some…. I’m wondering if it’s cache issue on our phones.