CODEWITHSUNDEEP
css
Zrb0529
Zrb0529

Reputation: 800

Apply CSS Text Shadow to text in IE

I've used a text shadow in CSS for font smoothing and it looks great in pretty much everything except IE. The CSS is:

#navigation li {
display: inline;
list-style: none;
display: block;
float: left;
width: 15em;
height: 2em;
text-align: center;
padding: .5em 0 0 0;
margin: 0;
border-left: .0625em solid #FFF;
border-right: .1em solid #CCC;
text-shadow: .0625em .0625em .0625em #ffffff;
filter: dropshadow(color=#ffffff, offx=1, offy=1);
filter: glow(color=black,strength=1);

}

In IE the text looks like this: https://www.dropbox.com/s/578y9y8fjvlx072/Screen%20Shot%202012-10-04%20at%2010.33.11%20PM.png

But, in Safari, Chome, FireFox, and Opera it looks like this: https://www.dropbox.com/s/hvunkc4ql8ry0u5/Screen%20Shot%202012-10-04%20at%2010.33.23%20PM.png

Upvotes: 0

Views: 67

Answers (2)

Fredy
Fredy

Reputation: 2910

Try this CSS properties:

 filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=1, OffY=1, Color=#ffffff);

Try this demo in IE: http://jsfiddle.net/ongisnade/Dw7kz/

Upvotes: 2

raam86
raam86

Reputation: 6871

Explorer renders methods with a different engine so what you see is actually a feature.

You can try setting strength=0 and it should be displayed correctly.

Upvotes: 1

Related Questions