Geek asks and answers

IE 8. Gradient background + image

How can I make IE8 show image with gradient + image. This is possible in other browsers, but in IE it does not work.

In other browsers:

/* Opera */ 
background-image: url(gxt/images/my/eye.png) , -o-linear-gradient(top, #FFFFFF 0%, #EFCA11 100%);
/* Webkit (Safari/Chrome 10) */ 
background-image:url(gxt/images/my/eye.png) , -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #EFCA11));
0
source share
2 answers

I found the answer to my question:

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#FFFFFF", endColorstr="#EFCA11",GradientType=0 ), progid:DXImageTransform.Microsoft.AlphaImageLoader(src="gxt/images/my/eye.png");
+3
source

IE8 does not support CSS gradients (so this will not work). IE9 has limited support, as far as I remember, and IE10 will support full support. I'm not sure what you are trying to do, but if you want to get a background image with a gradient before or after, how about stacking two images (one with a gradient, one with the actual background) or merging both into one image?

+1
source

More articles:


All Articles