- FingerStyle Coding

IE8 bug: PNG display with strange gradient

Posted on February 26, 2011 by Andrei STOLERU 1 Comment

Recently I had a problem with a background image that it was displayed with a strange gradient that fades in the right-bottom corner of the container.

Problem: If you are using a semi-transparent PNG (1 x 1 px) as a background-image with repeat, and Internet Explorer is displaying a strange graphic instead of a nice and consistent background, than you have to apply the next solution.

Solution: A very simple solution is to increase the size of the PNG to a minimum of 10 x 10 px. IE image render engine kind of sucks when it’s about rendering a small semi-transparent PNG on a big surface.

Post a Comment

Your email is never published or shared. Required fields are marked *