Image width is too wide in Outlook

Question

I am trying to send html emails with images. Images look good in all email clients but in outlook they are too wide. How to fix max-width of image?

    <table id="cg-cmgxsgg" class="widget widget-image " width="580" data-widget-code="email-image">
   <tbody>
      <tr>
         <td align="center">
            <div><img src="http://vcap.me//file/get/ce2c1e66-2129-41e8-903c-a40300e7bbd0" width="580" alt="" style="float: none; margin-left: auto; margin-right: auto;"></div>
         </td>
      </tr>
   </tbody>
</table>

Answer 1

Regardless of CSS support or HTML attributes, the main factor that is causing the issue in Outlook is the actual size of the image. Outlook usually ignores whatever HTML sizing (width= or height=) or CSS styling (width:, height:) and goes off of the embedded information in teh image. This is all based off DPI setting as well as the renderings of the Word HTML engine.

Mailchimp solutions

Below is snippet explaining the issue in more detail from here

"This issue usually happens when you are using a picture other than 96dpi.

When inserting a picture, Outlook will rescale the image as if it was a 96dpi image. This means that if you have a picture of 150dpi with a height of 88px, it will be displayed as an image of 56px high; 88px/150dpi * 96dpi = 56px

It even gets worse; upon sending, Outlook will convert and compress (re-render) the images to 96dpi with the new dimensions permanently! This means that all the "detailed" picture information is lost and you'll be sending an image of 96dpi which is 56px high. This is of course a severe and very visible quality loss.

If your picture is less than 96dpi, then the opposite happens. A picture of 88px high with a dpi of 32 would then result in a 96dpi image of 264px high. So the result will be a very large image (but this time you can resize it back without the image becoming blurry).

This is a long outstanding issue/function/design choice which goes back all the way to Word 6.0 from 1993."