title: How to make IE 11 honour columns widths in tables when containing large images in rows?
body: <p>The below works fine in Chrome (latest) and strangely in outdated IE versions - but in the latest IE version (11) it does not seem to behave as I would like.</p>
  
  <p>In Chrome (latest) and outdated IE versions Column 1 does not change its width to accommodate the large image in Column 2, but in the latest IE version (11) it does - how to correct this?</p>
  
  <pre><code>&lt;table&gt;
   &lt;tr&gt;
    &lt;td class="header"&gt;
       Column 1
    &lt;/td&gt;
    &lt;td class="header"&gt;
       Column 2
    &lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
     &lt;td class="body_twenty"&gt;
       &lt;table&gt;
          &lt;tr&gt;
             &lt;td&gt;
                Test...
             &lt;/td&gt;
          &lt;/tr&gt;
       &lt;/table&gt;
    &lt;/td&gt;
    &lt;td class="body_eighty"&gt;
       &lt;table&gt;
          &lt;tr&gt;
             &lt;td&gt;
                Test...
             &lt;/td&gt;
             &lt;td&gt;
                Test...
             &lt;/td&gt;
          &lt;/tr&gt;
       &lt;/table&gt;
    &lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
    &lt;td class="body_twenty"&gt;
       &lt;table&gt;
          &lt;tr&gt;
             &lt;td&gt;
                Test...
             &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
             &lt;td&gt;
             &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
             &lt;td&gt;
             &lt;/td&gt;
          &lt;/tr&gt;
       &lt;/table&gt;
    &lt;/td&gt;
    &lt;td class="body_eighty"&gt;
       Test...
       &lt;img src="http://www.psdgraphics.com/file/colorful-triangles-background.jpg"&gt;
    &lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td class="footer"&gt;
    &lt;/td&gt;
    &lt;td class="footer"&gt;
    &lt;/td&gt;
   &lt;/tr&gt;
   &lt;/table&gt;
  </code></pre>
  
  <p>See: <a href="https://jsfiddle.net/tLfur3xz/1/" rel="noreferrer">https://jsfiddle.net/tLfur3xz/1/</a></p>