I have been facing issue of scaling images on Outlook of Retina Display[**dell xps 13**]. Machine has 4K resolution which is zoomed to 225% on windows-10.

I tried every thing and tried all solutions from differnet portals but nothing worked. Any one can help me out to fix this issue, its urgent.

I followed this solution:

<------------ HTML ----------->

<html xmlns="http://www.w3.org/1999/xhtml"
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Base Email Template</title>
<!--[if gte mso 9]><xml>
<style type="text/css" media="screen">
html { background-color: #edf2f8; }
body { width: 600px !important; }
.ExternalClass { display: block !important; width: 100%; }
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height: 100%; }
body, p, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }
body, p, td { font-family: Helvetica, Arial, sans-serif; font-size: 15px; color: #333333; }
body * { font-family: Helvetica, Arial, sans-serif; }
h1 { font-size: 24px; font-weight: normal; line-height: 24px; }
body, p { margin-bottom: 0; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; font-family: calibri !important }
img { outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; }
a img { border: none; }
.background { background-color: #edf2f8; margin: 0 auto;  }
table.background { margin: 0; padding: 0;  width: 600px !important;}
.block-img { display: block; line-height: 0; }
a { color: white; text-decoration: none; }
a, a:link { color: #2A5DB0; text-decoration: underline; }
table td { border-collapse: collapse; }
td { vertical-align: top; text-align: left; }
.wrap { width: 600px; }
.wrap-cell { padding-top: 30px; padding-bottom: 30px; }
.header-cell, .body-cell, .footer-cell { padding-left: 20px; padding-right: 20px; }
.header-cell { background-color: #4f616b; font-size: 20px; font-family: Helvetica, Arial, sans-serif; color: #ffffff; padding-top: 8px; padding-bottom: 8px; vertical-align: middle !important; }
.body-cell { background-color: #ffffff; padding-top: 15px; padding-bottom: 20px; text-align: center; }
.footer-cell { color: #fff; font-size: 12px; padding: 6px 0px; display: table-cell; text-align: center; vertical-align: middle !important; background: #f26f21; }
.footer-cell a { color: #fff; }
.card { width: 400px; margin: 0 auto; }
.data-heading { text-align: right; padding: 10px; background-color: #ffffff; font-weight: bold; }
.data-value { text-align: left; padding: 10px; background-color: #ffffff; }
.force-full-width { width: 100% !important; }
<style type="text/css" media="only screen and (max-width: 600px)">
@media only screen and (max-width: 600px) {
body[class*="background"], table[class*="background"], td[class*="background"] { background: #eeeeee !important; }
table[class="card"] { width: auto !important; }
td[class="data-heading"], td[class="data-value"] { display: block !important; }
td[class="data-heading"] { text-align: left !important; padding: 10px 10px 0; }
table[class="wrap"] { width: 100% !important; }
td[class="wrap-cell"] { padding-top: 0 !important; padding-bottom: 0 !important; }

<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" bgcolor="" class="background">
<table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="600" class="background">
    <td align="center" valign="top" width="100%" class="background"><center>
        <table cellpadding="0" cellspacing="0" width="600" class="wrap">
            <td valign="top" class="wrap-cell" style="padding-top:30px; padding-bottom:30px;"><table cellpadding="0" cellspacing="0" class="force-full-width">
                  <td colspan="2" height="109" width="600" align="center" style="width: 600px; height: 109px;"><!--[if mso]> <center> <table width="600"><tr><td width="600" height="109" class="outlookemail"><![endif]--> 
                    <img src="http://ultrabotlms3.knowledgeplatform.com/M1/Learner/images/bannerlage.png" width="600" height="109" alt=""/><!--[if mso]> </td></tr></table> </center><![endif]--></td>
                  <td valign="top" colspan="2" class="body-cell"><table cellpadding="0" cellspacing="0" width="100%" bgcolor="#ffffff">
                        <td valign="top" style="background-color:#ffffff; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: normal; color: #000; line-height: 18px; text-align: left;"> Dear <b> Username </b><br/>
                          <p>Thank you for signing up for account.  You will receive a confirmation email once your account has been created.</p>
                          <p>In the meantime if you have any questions, please feel free to contact us at 123 456 789.</p>
                          <p>Thank you for using System,</p>
                          <b> Google HR </b> <br/>
                          <a href=""> http://www.google.com </a></td>
                  <td  colspan="2" height="2"></td>
                  <td  valign="middle" colspan="2" height="30"  class="footer-cell" style="font-family: Helvetica, Arial, sans-serif;"> Copyright text here. 2017 </td>