Mkhuda
Mkhuda

Reputation: 69

Bad pixel background image in IE 8

I had a small problem on internet explorer 8 and 9 that image results are not as expected. Pixel quality is very poor, but in other browsers like chrome, opera, and firefox looks very good.

this is my results :


enter image description here


the images rendered by IE looks fractions on a circle, and this is my CSS code :

.social-profiles ul li.facebook a {
    background: url(img/flat-social-icons/32px/Facebook-32.png);
    text-indent: -9999;
    opacity: 0.4;
    filter: alpha(opacity=40); /* msie */ }

Upvotes: 2

Views: 523

Answers (1)

Jimmy Breck-McKye
Jimmy Breck-McKye

Reputation: 3034

I believe this is an issue with using the MSIE alpha filters with PNGs that possess alpha transparency themselves.

Your options are to:

  • bake the transparency into the image itself with an alpha channel
  • give the icons an opaque background that blends into the context
  • give the icons a transparent background gradient by using the MSIE gradient filter

I would choose the third for flexibility, but the first is probably the fastest.

Upvotes: 5

Related Questions