Hi. My name is Nick Cairns, and I'm a user experience designer/ developer living in Vancouver, Canada where I am Co-Founder at wantering.



Losing ClearType in Internet Explorer

Sometimes IE7 likes to stop using ClearType (fonts look pixily or lack anti-aliasing).  You may not even notice it at first.  But, it does happen, and it isn’t the font-size you are using or some other bug that you think IE might have drummed up for you.

What you have encountered is a clash with  DXImageTransform (most likely using filter opacity).  The most likely scenario is that you are trying to do a fade in or fade out on an element whilst the browser is trying to display the text using ClearType.  It simply can’t do this, and IE will remove ClearType altogether on the element.

To fix this ClearType rendering issue, you can do one of two things:

  1. Consider removing the fade (this may not be an option).
  2. In your JavaScript, do something like‘filter’) on the element after the fade is complete (IE only of course).  Doing so will re-enable ClearType but might cause a flicker from aliased to anti-aliased text.

See Matt Berseth’s original write-up on IE7 cleartype issues for more in depth coverage.

Comments (View)
blog comments powered by Disqus