Any way to have fully responsive image display on mobile?

  • 1
  • Idea
  • Updated 4 years ago
  • Not Planned
It seems that when we create a row of images using the drag n drop editor, the selected images auto-size really effectively into the space allocated.

We'd hoped that the mobile view, because it converts the row of 2-4 pics into a vertical stack of individual images, would also be able to display the images responsively, resizing to 100% width (in this instance 383 px, for decent looking stacked appearance in responsive mobile).

What it seems to do, instead, is stack the single images and display them at the same px size that was dynamically set for the desktop row appearance. 

We've tested it on stationery we created for the client, then on selected templates from the template gallery, and on blank templates -- and it seems to be the default behavior, whether or not we use "best fit" on the pics, and whether we have smart sizing on or off...

Is this just the default behavior of responsive mobile in Emma mailers at this time, or are we missing something we should have tried?

Our intention, of course, was to be able to load images that would be 100% on mobile, when the row becomes a 1-up stack view, and know that they'd size right for the constrained width row on desktop (which is an awesome result, for that view). We love the multi-image row feature, but it just doesn't appear to work for true responsive image display.

I looked through a bunch of other posts, including:
Thanks for your help!



ACTUAL IMAGE EXAMPLE (1 of  used in a row):
383 px wide (so that it could responsively display 100% on mobile).


Using a row of 3-up images in drag & drop, and adjusting padding as needed, the desktop result is ideal. The 3 images auto-scale and align into a perfectly matched display. 


: We'd like the stack to display the 3 images at 100% on mobile, but the multi-image row, when rendered for mobile, has the stacked pics displayed at the same scaled down size as on desktop. 

Photo of NetCrafters


  • 4 Posts
  • 0 Reply Likes

Posted 4 years ago

  • 1
Photo of Emily Hollingsworth

Emily Hollingsworth, Alum

  • 2203 Posts
  • 158 Reply Likes
Official Response
Hi there -- Thanks so much for including so much detail here. Super helpful!
The multi-image block automatically resizes images when emails are sent. In this case the 383px wide images are sized down to 133px in order to fit the horizontal length of the template when displayed on a desktop email client.

Because most mobile devices are much wider than 133px, we purposely chose to display these images at that 133px width on mobile. The alternative was to enlarge the images to 100% width of the screen, but that would have resulted in the images looking blurry or "pixelated." We felt smaller and crisp was better than larger and blurry.

The root of the problem as you've alluded to is the images being sized down from their original 383px size. We've had discussions around resizing images in a way that would support both 100% mobile width and retina images, but for now that work isn't planned.