MailChimp stretching images to 100% problem

MailChimp has recently started to set max-width:100% to all my RSS driven email campaigns. While this may look nice on mobile, it totally distorts the email content on desktop.

The only way I can find a fix for this is to set my own images max-width:200px; in the MailChimp Design Editor, but this is a problem for certain images as they’re too big or too small.

Is there any other workaround around this? Thanks!

1 Like

We will need to see your code before hazarding guesses.

Sure. This is the code on the website:

<img class="alignleft wp-image-3931" src="http://www.***.com/wp-content/uploads/2016/02/MihoAida0011-300x266.jpg" alt="Miho Aida" max-width="200" max-height="177">

And this is the changed code in newsletter email (MailChimp, generated through RSS):

<img tabindex="0" class="CToWUd a6T" style="max-width:100%;width:100%;padding-bottom:0;display:inline;vertical-align:bottom;border:0;min-height:auto;outline:none;text-decoration:none" src="https://ci3.googleusercontent.com/proxy/QPvZjvVzeJKwzqRcvS5uH3YYWjGxziOFvcDz_TZe8NxL-Tlb-pV0ZlSWuWdvaUyHw9KmUr0YArBvaVTDpGXVmDdkjiCFGCOzOpttsPeUDFLJ4QRdRfdplKP3_1-P_iiWOkt6N9WUMKUB=s0-d-e1-ft#http://www.***.com/wp-content/uploads/2016/02/MihoAida0011-300x266.jpg" alt="Miho Aida" border="0">

As you can see the problem is in the extra max-width:100% code.

And thanks for any kind of suggestions!

Hi,

When you say this:

max-width:100%;width:100%;

You are basically saying:

width:100%;

Nothing else.

The max-width is redundant and has no effect and therefore your issue must be with the width:100% which will stretch all images to fill the container which is unlikely to be what you want. The max-width:100% on the other hand will only come into play when the images natural width is greater than the space available and then it will scale it smaller.

I can’t of course account for the way that email clients will handle specific code but it seems to be you need to remove the width:100% but leave in place the max-width:100%.

In your emails you could also add in:
style=“white-space: pre-wrap;” to

That should stop the code blocks stretching out the width of the email.

I’m no good at PHP but it looks pretty simple to add this in.

Post edited by TechnoBear to remove fake signature

Thanks for the reply guys! I managed to get this fixed by using Align RSS Images Wordpress plugin and finding the option in MailChimp that disables this 100% auto-stretch.

Glad you sorted it :slight_smile:

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.