CODEWITHSUNDEEP
javascriptinternet-explorercssweb
Mazhar Ahmed
Mazhar Ahmed

Reputation: 1533

CSS 3 text shadow in IE

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?

Upvotes: 1

Views: 2126

Answers (1)

Frank van Wijk
Frank van Wijk

Reputation: 3252

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.

Upvotes: 3

Related Questions