Discussions

Picture in email signature shows not good in MS Outlook

I have created some dynamic content for a personalized signature under an email. This dynamic content contains a picture/photo of the account manager. The email looks good on mobile, Hotmail, Gmail but not in Outlook (MS Office 365) it blows up the email.

The code used is:

<p style="text-size-adjust: 100%; padding: 0px; margin: 0px; font-family: Arial; font-size: 16px;">Met vriendelijke groet,<br style="text-size-adjust: 100%;" />

&nbsp;</p>


<div style="text-size-adjust: 100%; font-family: Arial; font-size: 16px; border-style: none;"><span class="eloquaemail" style="text-size-adjust: 100%;" unselectable="on">Accountmanager1</span>&nbsp;<br style="text-size-adjust: 100%;" />

Accountmanager Vattenfall Zakelijke Markt<br style="text-size-adjust: 100%;" />

T.&nbsp;<span class="eloquaemail" style="text-size-adjust: 100%;" unselectable="on">Accountmanager_Phone1</span><br />

&nbsp;</div>

<img class="elq-responsive " src="http://images.zakelijkemarkt.nuon.nl/EloquaImages/clients/NVNuonEnergy/%7B88e802f0-29f4-40d3-a0e7-6e46d9722c0d%7D_naambestand1.jpg

" style="width: 10%; height: auto; max-width:1130px" /><br />

<br />

<span style="color: rgb(62, 52, 53); font-family: arial, helvetica, sans-serif; font-size: 16px;">Meer informatie over </span><a data-targettype="webpage" href="https://www.vattenfall.nl/grootzakelijk/service-beloften/?cmp=EMC-155-7552&elqTrackId=9534ae12ea5a4a7eae989df75de7ecd3" style="font-family: arial, helvetica, sans-serif; font-size: 16px;" title="onze servicebeloften">onze servicebeloften</a>

Could someone help me how I can fix this also for Outlook?


Regard,

Sandra

Tagged:

Answers

  • ppilotti
    ppilotti Posts: 16 Bronze Medal

    Hi Sandra,

    On you image tag add desired desktop width, also for safety you may want to also add border=0

    More advanced rending engines will ignore the deprecated width statement, but outlook 2007, (Et al.) needs it.

    <img class="elq-responsive " src="your image address here" style="width: 10%; height: auto; max-width:1130px" width="1130" />

    BTW, don't forget your alt tags, ADA screen readers have no idea what your image looks like.

    Hope this helps,

    Pete