Grow your CSS skills. Land your dream job.

Pixelated Header Fonts in Internet Explorer

  • # September 27, 2012 at 1:38 pm

    Hello,

    I’m experiencing font pixelation on my header fonts when viewed in Internet explorer. It’s almost as if there’s a text-shadow at play, but I’ve checked all my css and I have text-shadow disabled when viewed in IE. it’s very strange. I’ve even switched to a basic arial font and I still get the bizarre pixelation. Any ideas on how to fix this?

    Example: http://www.dropbox.com/s/sbio2shkfnse0hi/Screen%20Shot%202012-09-27%20at%2010.27.24%20AM.png

    # September 27, 2012 at 1:59 pm

    try this might or not might work: font-smooth:always;

    # September 27, 2012 at 2:01 pm

    Using any opacity there?

    # September 27, 2012 at 2:10 pm

    I believe I fixed it. Had to go to my IE specific style sheets and add: text-shadow: none; filter: none; . Didn’t think filter was necessary, but apparently that did the trick.

    # September 27, 2012 at 2:20 pm

    Yup, that’s why I asked. Filters (opacity especially) on an element with no background does that. Normally the trick is to give the element a background color but in this case you wouldn’t want that, and I don’t really see the need for a filter in the first place. Glad it was fixed!

    # September 27, 2012 at 2:23 pm

    I hate IE so much. Everything looks like garbage in that browser. Thanks for the help all.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".