title: Image scaling in IE 11, 10, and 9 is terrible
body: <p>Before you say this is an existing question, or that all I need to use is ms-interpolation-mode, or that I just need to have a pre-scaled version of the image on the server and serve that up, read the question. Please. None of those are appropriate.</p>
  
  <p>I have an app that draws a very large image using the HTML5 canvas in the browser on all modern browsers. I pull an image out of that canvas and display it (shrunk down considerably in size on-screen). The scaled down image looks fine on Chrome, Firefox, Safari, or Opera whether Windows or Mac. IE however looks very terrible, even though I'm not testing this on old versions of IE (like IE 7 where the ms-interpolation-mode works), but only on IE 9, 10, and 11.</p>
  
  <p>Why are they not smoothly scaling down the image? I thought later versions of IE could do this?</p>
  
  <p>Here's a screenshot of my image saved off as a PNG file and loaded up in IE 11. Note that it's broken even if all I'm doing is looking at the PNG. My software and my web page are completely out of the picture here. This is just IE 11 showing a PNG file.</p>
  
  <p><img src="https://i.stack.imgur.com/p3iqc.png" alt="WTF Microsoft?"></p>
  
  <p>Am I going to have to do some kind of resizing in the canvas just to make a reduced size version for IE because they can't handle image scaling that every other browser on the market handles with ease? Is there nothing I can turn on via CSS to make this look better?</p>
  
  <p>Here's a direct link to one of the generated images: <a href="https://i.imgur.com/T9wgHSo.png" rel="noreferrer">http://i.imgur.com/T9wgHSo.png</a>. Show me how to make this look good in a significantly smaller (say 0.25x) size in a page for IE 9, 10, and 11.</p>