title: Shrink image size to fit table cell, which works in all browsers?
body: <p>I have a <code>table</code> which has images in its cells. I want these images to shrink automatically when the window width is reduced. But they should <strong><em>not</em></strong> expand beyond their native size when there's extra space around.</p>
  
  <p>I have a solution for this which works in Chrome, but it does not work in Firefox or Internet Explorer. On Firefox and Internet Explorer, images do not shrink when the window width is reduced, and instead a scroll appears.</p>
  
  <p><strong>How do I get it to work on all browsers ?</strong></p>
  
  <p><strong>JSFiddle:</strong> <a href="http://jsfiddle.net/ahmadka/GeDxr/" rel="noreferrer">http://jsfiddle.net/ahmadka/GeDxr/</a></p>
  
  <p><strong>CodePen (JSFiddle is down sometimes):</strong> <a href="http://codepen.io/anon/pen/JhsED" rel="noreferrer">http://codepen.io/anon/pen/JhsED</a></p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div class="imageTable"&gt;
      &lt;table&gt;
          &lt;tbody&gt;
              &lt;tr&gt;
                  &lt;td&gt;
                      &lt;img class="autoResizeImage" src="http://173.254.28.69/~bluraysp/web/images/footer/payment/normal/moneybookers.png" /&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;img class="autoResizeImage" src="http://173.254.28.69/~bluraysp/web/images/footer/payment/normal/2checkout.png" /&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;img class="autoResizeImage" src="http://173.254.28.69/~bluraysp/web/images/footer/payment/normal/visa.png" /&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;img class="autoResizeImage" src="http://173.254.28.69/~bluraysp/web/images/footer/payment/normal/mastercard.png" /&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>.autoResizeImage {
      max-width: 100%;
      height: auto;
      width: auto;
  }
  </code></pre>