How To Retain Image Dimensions In Mailchimp Templates

I'm creating a template in Mailchimp to send out newsletters. The template contains a repeatable section with an image of a prefixed size. For some reason it strips the width='' an

Solution 1:

For others reference I have now spoken to mailchimp and using a combination of the code at https://www.snip2code.com/Snippet/25348/HTML-Email-Template--max-width-hack-for- (below) and max-width/max-height css values for the img fixes the problem in outlook:

<!--[if (gte mso 9)|(IE)]>
<center>
  <table>
    <tr>
      <td width="600">
        <![endif]--><divstyle="max-width: 600px; margin: 0 auto;"><p>This text will be centered and constrained to 600 pixels even on Outlook which does not support max-width CSS</p></div><!--[if mso]>
      </td>
    </tr>
  </table>
</center>
<![endif]-->

Solution 2:

To get around this issue you must have a max-width specified on the actual image itself, and make sure it's inlined onto the tag like this:

<img mc:edit="image" src="image.jpg" width="200" style="max-width: 200px;">

It doesn't count if it's included in the CSS in the head.

I have found that the max-width needs to be the VERY LAST thing you specify in the styles. So if you also specified a background, for example, you would put that first, i.e. background-color: #fcfcfc; max-width: 200px;.

Last time I tried this, the MailChimp editor would only add the width="200" AFTER the image has been edited, so if you left the placeholder image alone, it would have no width applied and thus remain at native size. Unfortunately I'm no longer sure if this is the case, and am not paying for Mailchimp right now so I can't check.