Text Shadow not working in IE


I found a good article from:

CSS3 Text-Shadow – Can It Be Done in IE Without JavaScript?

and have followed the step-by-step process meticulously, but I still cannot get IE to display the shadow…

The CSS Ive used is :

body.ie6 h2,
body.ie7 h2,
body.ie8 h2,
body.ie9 h2 {
	zoom: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#f4f7f9) progid:DXImageTransform.Microsoft.DropShadow(Color=#ff0, OffX=2, OffY=2)";
	filter: progid:DXImageTransform.Microsoft.Chroma(Color=#f4f7f9)
	        progid:DXImageTransform.Microsoft.DropShadow(OffX=2, OffY=2, Color=#ff0);

p.s Thanks to Paul Irish for coming up with this by the way. I know its something Ive screwed up so just need a fresher pair of eyes to pick out my error…


The shadow is working for me in IE6 - 8 ( but looks very strange as it is quite offset).

I get no shadow in IE9 (or indeed any text). Even the demos in the article you linked to don’t work for me in IE9. (However I am running IE9 on mac parallels so there may be an issue there although everything else I have tested works fine)

Hi Paul,

Out of interest do you know of any other techniques to get IE (particulary IE 9)
to display some form of respectable text shadow ?

Alternatively I can just leave the standard code “text-shadow” in and just not allow IE users the pleasure of seeing my wee shadow :slight_smile:

I’m inclined to leave IE alone though and not bother with all those shadow filters as they are very fragile.

You could use javascript as a last resort (and [URL=“http://heygrady.com/text-shadow-for-internet-explorer”]another example here although even this is broken in my IE9 but that may be my problem with parallels).

The Impressive Webs one (the first) works for me in IE9 on Mac with VMWare Fusion, but the second one doesn’t.

I just updated my mac parallels to the latest version (6) and the filter is now working in IE9. It looks a bit strange but of course I assume you have extra code to go with it.

Both are working for me now that I’ve upgraded to parallels 6.:slight_smile:

Duh, I didn’t read the page properly. Scrolling down the page I see that the heygrady version does work in Fusion. (I only looked at the first example.)

What I know and have read, the IE filters is very slow, and can affect loading speed - At the moment I’m building a site myself where I use text-shadows on some of the text.

IE is left behind, I support all browsers except IE6, the sites are working in IE7+ and all other major browsers, text-shadow ain’t applied to IE…

You can do it with Javascript indeed, but yeah, A clever man said:

Do websites have to look the same in every browser?

Yes the filters are detrimental to page speed in most cases which is why I’m loathe to use them other than for IE6 for png transparency and only then as a last resort.

I’m not keen on utilising the IE filters for more modern versions like ie8+. I would prefer to let them have normal text and avoid the issues.

For years the web community has been berating MS for introducing these weird and wonderful filters and have avoided them like the plague (since being previously subjected to front-page transitions on every page turn). However, suddenly it has become ok to try and reproduce css3 effects using these filters and quite often suffer the consequences.

I can’t put my finger on why it is suddenly ok to use them now but you would have been shot if you had used them before css3! It’s a strange world :slight_smile:

Well remember, about half the “gee ain’t it neat” stuff in CSS3 already exists in IE all the way back to IE5.

Everything old is new, shiny, and all the new kids never learned why these things were abandoned/not adopted, and everyone else has the memory of a goldfish.

Besides, you know all your FSF zombies are spanking it in the corner screaming “Great Satan, Great Satan” over anything Microsoft. You make it non-M$, it’s the best thing since Internet porn; you make it M$, it’s out to take over the world with an evil capitalist agenda. More so when you get into the EU where the definition of a “monopolistic practice” is apparently “doing the same thing the competition is”

At least when non-M$, it is potentially available to everyone.