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.

 
   
Outlook Desktop Retina Images

dwstanhope

Newbie
Total Posts:  3
Posted: 21 July 2016 10:55 PM

Hi fellow emailers.

My name is David. I began employing fluid emails, inspired by the free Coffee Ship template EOA so kindly provided. All is great except when I come to retina/doube-sized images in Microsoft Outlook 2007 upwards.

As MO ignores the max-width property, the images display at full width. I’ve read several possible solutions (including ghost tables,) but I just can’t seem to get anything to work?

Defining image width then interferes the fluid 100% property in different windows.

Can anyone help me out, pleeeease!


 

Geoff Phillips

Avatar
Sr. Member
Total Posts:  386
Posted: 22 July 2016 05:54 AM
[ # 1 ]

dwstanhope,
Welcome to the forum!

I tried replacing an image from the Coffee Shop template with a 2x size image, and I was able to get it to work with no other code changes. The width attribute constrains the size in Outlook and the 100% width style seems to take over in iPhone etc.

<img src="http://img-aws.ehowcdn.com/560x560p/photos.demandstudios.com/51/203/fotolia_4100189_XS.jpg" width="280" alt="" style="border-width:0;width:100%;max-width:280px;height:auto;" /> 

Can you send me a sample of code you’re trying to get working? I’ll see what I can do.


 

dwstanhope

Newbie
Total Posts:  3
Posted: 24 July 2016 08:39 AM
[ # 2 ]

Hi Geoff.

Thanks for the reply! The image I’m targeting has larger dimensions: it’s for the header and the original is about 1000px, resized down to a 640px width.

The code is the coffee shop template’s header image, nothing else has been altered so far. If I fix it at 640px in the width property, the test for Android and iPhone seems to be coming back as that and creating a scroll bar/non-responsive email.


 

dwstanhope

Newbie
Total Posts:  3
Posted: 25 July 2016 10:16 PM
[ # 3 ]

Hi Geoff.

As a follow-up, I think I might have it working. It’s tested okay now with some modifications - I think I had the MSO code in the wrong place. I noticed on testing though that AOL mail rendered the images full-size - do the max-width properties not work for it either?

If not, is there any workaround there?