title: Outlook 2016 changes units of width on table elements
body: <p>I have an HTML email laid out with tables:</p>
  
  <pre><code>&lt;table class='top-level' cellpadding="0" cellspacing="0" border="0" 
    width="630" height="717" bgcolor='#ffffff' style="width:630px; 
    height:717px; background-color: white; background: white; 
    border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;"&gt;
  
    &lt;tr&gt;
      &lt;td class='image-container' id="FOOBAR" valign="top" width="630"
        style="width:630px !important; background-color: #DEE7F5; 
        background-image: -webkit-linear-gradient(left, #b6cae8, #ffffff); 
        background-image: -moz-linear-gradient(left, #b6cae8, #ffffff); 
        background-image: -o-linear-gradient(left, #b6cae8, #ffffff);  
        background-image: linear-gradient(#b6cae8, white); background: 
        linear-gradient(#b6cae8, white);"&gt;
  
        &lt;!--[if gte mso 9]&gt;
          &lt;v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:630px;"&gt;
            &lt;v:fill type="gradient" color="#ffffff" color2="#b6cae8" /&gt;
            &lt;v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0"&gt;
        &lt;![endif]--&gt;
  
        &lt;div&gt;&lt;table&gt;&lt;!-- stuff --&gt;&lt;/table&gt;&lt;/div&gt;
  
        &lt;!--[if gte mso 9]&gt;
            &lt;/v:textbox&gt;
          &lt;/v:rect&gt;
        &lt;![endif]--&gt;
  
      &lt;/td&gt;
    &lt;/tr&gt;
  
  &lt;/table&gt;
  </code></pre>
  
  <p>This works perfectly in Outlook 2007/10/13, as well as all the other clients I care about, EXCEPT for Outlook 2016 (Windows version). In Outlook 2016, the <code>td.image-container</code> element displays at only about 2/3 of the expected width. When I check out the HTML (by saving the message as HTML), it shows that the widths I set in the <code>style</code> attributes are in <code>pt</code> units and the relationship between the Outlook value and my original value isn't clear. The reformatting also strips my class and my id.</p>
  
  <p>The <code>width</code> attribute seems to get set to the pixel value equal to the point value in the <code>style</code> attribute. Because the <code>style</code> width is set in points even on elements without a width attribute, I assume that it's the <code>style</code> value adjusting the <code>width</code> value.</p>
  
  <p>How can I make sure my original width is respected?</p>
  
  <pre><code>&lt;html xmlns:v="urn:schemas-microsoft-com:vml"
    xmlns:o="urn:schemas-microsoft-com:office:office"
    xmlns:w="urn:schemas-microsoft-com:office:word"
    xmlns:m="http://schemas.microsoft.com/office/2004/12/omml"
    xmlns="http://www.w3.org/TR/REC-html40"&gt;
  &lt;head&gt;...&lt;/head&gt;
  &lt;body bgcolor=white lang=DE link="#497CBE" vlink="#497CBE" style='tab-interval:
    35.4pt' alink="#497cbe"&gt;
  &lt;div class=WordSection1&gt;
  
  &lt;table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0 width=945
    style='width:472.5pt;background:white;border-collapse:collapse;mso-yfti-tbllook:
    1184;mso-padding-alt:0cm 0cm 0cm 0cm'&gt;
  
    &lt;tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;mso-yfti-lastrow:yes'&gt;
      &lt;td width=630 valign=top style='width:315.0pt;background:#DEE7F5;
        padding:0cm 0cm 0cm 0cm'&gt;
      &lt;p class=MsoNormal&gt;&lt;!--[if mso &amp; !supportInlineShapes &amp; supportFields]&gt;&lt;span
        style='font-size:10.5pt;font-family:"Arial",sans-serif;mso-fareast-font-family:
        "Times New Roman"'&gt;&lt;span style='mso-element:field-begin;mso-field-lock:yes'&gt;&lt;/span&gt;&lt;span
        style='mso-spacerun:yes'&gt; &lt;/span&gt;SHAPE &lt;span
        style='mso-spacerun:yes'&gt; &lt;/span&gt;\* MERGEFORMAT &lt;span style='mso-element:
        field-separator'&gt;&lt;/span&gt;&lt;/span&gt;&lt;![endif]--&gt;&lt;span style='font-size:10.5pt;
        font-family:"Arial",sans-serif;mso-fareast-font-family:"Times New Roman"'&gt;
  
        &lt;!-- This linebreak added for readability; the conditional tag below was originally directly after the previous span tag --&gt;
  
        &lt;!--[if gte vml 1]&gt;&lt;v:rect
        id="_x0000_s1026" style='width:315pt;height:730.7pt;mso-left-percent:-10001;
        mso-top-percent:-10001;mso-position-horizontal:absolute;
        mso-position-horizontal-relative:char;mso-position-vertical:absolute;
        mso-position-vertical-relative:line;mso-left-percent:-10001;
        mso-top-percent:-10001' stroked="f"&gt;
  
        &lt;v:fill color2="#b6cae8" type="gradient"/&gt;
        &lt;v:textbox style='mso-fit-shape-to-text:t' inset="0,0,0,0"&gt;
  
          &lt;![if !mso]&gt;
            &lt;!-- doesn't matter --&gt;&lt;![endif]&gt;
          &lt;div&gt;
            &lt;table class=MsoNormalTable border=0 cellspacing=0 cellpadding=0
            width=945 style='width:472.5pt;border-collapse:collapse;mso-yfti-tbllook:
            1184;mso-padding-alt:0cm 0cm 0cm 0cm'&gt;
  
            &lt;!-- table stuff --&gt;
  
            &lt;/table&gt;
            &lt;p class=MsoNormal&gt;&lt;span style='mso-fareast-font-family:"Times New Roman"'&gt;&lt;o:p&gt;&amp;nbsp;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;
          &lt;/div&gt;
          &lt;![if !mso]&gt;&lt;!-- doesn't matter --&gt;
        &lt;![endif]&gt;&lt;/v:textbox&gt;
      &lt;/v:rect&gt;&lt;![endif]--&gt;&lt;/span&gt;&lt;!--[if mso &amp; !supportInlineShapes &amp; supportFields]&gt;&lt;span
      style='font-size:10.5pt;font-family:"Arial",sans-serif;mso-fareast-font-family:
      "Times New Roman"'&gt;&lt;v:shape id="_x0000_i1027" type="#_x0000_t75" style='width:315pt;
      height:730.7pt'&gt;
      &lt;v:imagedata croptop="-65520f" cropbottom="65520f"/&gt;
      &lt;/v:shape&gt;&lt;span style='mso-element:field-end'&gt;&lt;/span&gt;&lt;/span&gt;&lt;![endif]--&gt;&lt;span
      style='font-size:10.5pt;font-family:"Arial",sans-serif;mso-fareast-font-family:
      "Times New Roman"'&gt;&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;
      &lt;/td&gt;
    &lt;/tr&gt;
  
  &lt;/table&gt;
  
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Worth noting: the email displays as desired in the Email On Acid test suite for Outlook 2016 on Windows, but displays the broken behavior described here when viewed on the installation an Asus laptop (UX301 w/ i7-4558U CPU @2.8GHz &amp; Iris Graphics 5100) running Windows 10 Home (version 1511 build 10586.36). </p>