How can I have the image position changed in mobile?

  • 0
  • 1
  • Question
  • Updated 2 years ago
  • Answered
Currently I have a left aligned text block with a right aligned image. When viewed In mobile it stacks as it should however the image is on top of the text instead of being shown under the text in mobile. How can I get the image to stack under the text in mobile view?
Photo of Longwood Gardens

Longwood Gardens

  • 11 Posts
  • 0 Reply Likes

Posted 2 years ago

  • 0
  • 1
Photo of Sam Collis

Sam Collis, Customer Support Specialist

  • 252 Posts
  • 59 Reply Likes
Hi there!

Thanks for a great question.

When an email is mobile responsive, by default content is stacked left-to-right.  However it's also stacked in a way that text will sit under the image when it comes from the same content block.

In an instance where you're looking to reverse that order, it is possible but requires some coding.  If you have someone proficient in HTML/CSS on your team they can go into your template in your Assets folder and edit the media query.  Keep in mind that most likely they will need to hard code the content block in question here into the template for this to work as you'll probably want to define the stacking order specifically for this block.

From the Editor there isn't a great deal you can do, except change the layout.  The most straight-forward method is to have the image sit underneath the text instead of next to it, this would ensure that on mobile it remains underneath the text.  Understandably this would change the look of your mailing so you might not want to go down this path.

Otherwise, without making changes to the template's code there isn't a sure-fire way to change that stacking order.

Let me know if you have any questions! :)
Photo of Longwood Gardens

Longwood Gardens

  • 11 Posts
  • 0 Reply Likes
Hi Sam,

Thanks for your response and suggestions! I will look into changing the code.