We created an html email for an email campaign that looks great on all clients when we tested it on Email on Acid. The email is responsive using a fluid-hybrid technique. Later, we got a request to make it an editable template for MailChimp so they could use it again and again with just altering some of the text and some of the images.
The problem occurred when the client changes the images. After they change, everything looks great except, of course, in the Outlook client. The images were showing full-width of the original image size. Outlook will not constrain the size of the image using any technique except for the img tag attributes “width” and “height”. You can’t use CSS or the “style” attribute on the img tag.
The big question was why it wasn’t working on edited images but working with the original placeholder images. We confirmed when a user edits the image using the design editor, it removes the original “width” attribute hence Outlook will show the full-width of the original image no matter how many css styles you add.
It seems the only way around this when editing an image is to also click the “Settings” box and add the pixel value in the width field and “auto” in the height. We confirmed that this adds the width attribute to the img tag and Outlook is happy.
