Community Forum

Over the years we have built up a community of email marketers, coders and designers that live and breathe email.

Use the Email on Acid Forum like your virtual water cooler: Stop by to discuss email code, quirky clients and fixes and post your issues (with an example of the code) for our community to offer its assistance.

 
   
Email layout doesn’t remain the same for Outlook

Giulia

Newbie
Total Posts:  7
Posted: 19 October 2016 02:18 PM

Hi there,

I am having a problem with my template. It seems that the email changes layout according to different email providers: in gmail my email looks good, in Outlook it doesn’t.
How can I make sure my layout remains the same in each device/email?

here’s the email link https://www.emailonacid.com/app/acidtest/display/summary/tds3791c8RFFUx3jymiZOmxBWF42bMaxWY7xUuIDOBNcv/shared

File Attachments
HTML Code.pdf  (File Size: 83KB - Downloads: 105)

 

Geoff Phillips

Avatar
Sr. Member
Total Posts:  386
Posted: 19 October 2016 02:28 PM
[ # 1 ]

Giulia,
Welcome to our forum!

Yes, email can be very tricky. The reason your email looks so odd in Outlook is that you have an image set to style=“width:100%;”, with a native width of 879px. Outlook will display the image at its full size, breaking tables and the layout in general to do so. If you add a width attribute to the image, Outlook will respect that setting. Float is also generally not supported. You may want to try coding the image like this:

<img src="https://gallery.mailchimp.com/26aaf930b07ec7dd9fa5f9e63/images/e0f2e72d-3c73-4b53-9c52-fda10a1841c3.jpg?_ga=1.265884109.317127946.1474288811" width="310" style="float:left;width:100%; "

This will hep the image stay the correct size in Outlook.

You’ll find many helpful resources on our blog (https://www.emailonacid.com/blog) as well as in the Resources section of our site, under the Tips and Tricks section.

I hope that helps!


 

Giulia

Newbie
Total Posts:  7
Posted: 20 October 2016 02:25 AM
[ # 2 ]

Thank you very much! It did the trick, wonderful smile

Now, I have another problem: my email seems to be slightly moved to the left. On the right-hand side the border is larger.
Do you know why? The HTML is the same I have attached in the thread.