Cross browser text shadow

Question

I am looking for a way to get a text shadow that looks like a css3 text shadow, but it works with IE, Firefox, Opera, Safari, etc ... The solutions I found were either corrupted or did not look consistent in IE . Thanks

http://www.workingwith.me.uk/articles/css/cross-browser-drop-shadows

.shadow { height: 1em; filter: Shadow(Color=#666666, Direction=135, Strength=5); } 

This does not work for me ... in IE

 ul.dropdown a.selected-l { background-image: url('Images/Navigation/Left_round/hoverL.png'); height: 50px; width: 130px; font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; font-size: large; color: #FFFFFF; text-align: center; text-decoration: none; line-height: 50px; vertical-align: middle; /* pretty browsers*/ text-shadow:#000 0px 0px 5px; /* ugly ie */ zoom:1;/*force hasLayout*/ position:relative;/*for absolute position of child element*/ ; } ul.dropdown a.selected-l span { position:absolute; left:-7px;top:-7px; /* strength + pixelradius */ z-index:-1;/* force under the normal text */ /* the magic: filters */ filter: progid:DXImageTransform.Microsoft.Glow(Color=#eeeeee,Strength=2) progid:DXImageTransform.Microsoft.blur(pixelradius=5, enabled='true') ; zoom:1;/*force hasLayout*/ } 

Answer 1

My suggestion will be to use CSS3 text-shadow (for browsers based on Webkit, FF3.5, Opera 9.5).

For IE, use conditional IE comments to implement one of the following actions:

• sIFR
• cufon
• FLIR (not too sure about the shadow effect)
• IE-DXImageTransform

Some related articles:

• Cufon vs sIFR vs FLIR
• SO - sIFR or FLIR?
• SO - SIFR vs Cufon vs Typeface.js

Answer 2

Check out this post, I wrote about this issue:

Cross browser shadow using jQuery

Maybe it's more in your lane? I use jQuery, although not a very efficient way. But in any case, this is something. :)