title: IE 9 does not use sub-pixel antialiasing under certain conditions
body: <p>[Original title: <em>IE 9 text renders very poorly; is there a workaround?</em>)</p>
  
  <p>IE 9 is rendering the text in my application very poorly.  The problem is not in my monitor's Clear Type settings, since IE 9 in compatibility mode, Firefox, and Chrome all render text nicely.  Here's a side-by-side comparison of how the text is rendered with IE 9, IE 9 in compatibility mode, and Chrome:</p>
  
  <p><img src="https://i.stack.imgur.com/MVC7h.png" alt="IE 9"></p>
  
  <p><img src="https://i.stack.imgur.com/78yBZ.png" alt="IE 9 Compatibility Mode"></p>
  
  <p><img src="https://i.stack.imgur.com/mdBG9.png" alt="enter image description here"></p>
  
  <p>I tried applying <a href="https://stackoverflow.com/questions/778208/jquery-fadein-leaves-text-not-anti-aliased-in-ie7/1719198#1719198">this answer</a>, but it doesn't seem to apply to anything after IE 7.  Does anybody know of any workarounds we can apply to our site to fix IE 9's bad text rendering?</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>I've boiled down the problem page to the bare essentials.  As you can see, it doesn't take much to reproduce.  Be sure that IE has a browser mode if IE9 and document mode of IE9 standards:</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
    &lt;body style="background-color: rgb(30, 34, 59); color: rgb(255, 85, 0); font-size: 20px"&gt;
      Home
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>