Question

I’m using CSS 3 text shadow to simulate bevel and emboss effect in my web app. The problem is IE 10 shows very bad looking shadow. I didn’t checked it on IE 9 still now. But Can it be fixed?
This is the CSS I’m using ::

text-shadow: 0px 1px 1px #A4A4A4;
filter: dropshadow(color=#A4A4A4, offx=0, offy=-1);

Is there any javascript library to show text shadow in IE? or any other tricks that will help me? Or any extra CSS properties to add to solve this?

Answer 1

You could try the other shadow filter.

.shadow {
    /* For IE 8+ */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

Or use a behaviour file that simulates CSS3:
http://fetchak.com/ie-css3/

Update: Sorry, I misread, that shadow filter is for box-shadow, not text-shadow.
Internet Explorer does not suppurt text-shadow, but you can simulate this with a drop-shadow and a glow filter, see this tutorial.