Text Shadow Filter in IE

You can drop shadows to text using the text-shadow property which was re-introduced in CSS3. The syntax goes as:

.divOne { text-shadow: 3px 4px #666; }

which adds a drop shadow hex code #666 3px to the right and 4px down from the original text. However text-shadow works on only Firefox, Opera and WebKit browsers. It is not supported in IE.

In IE 5.5+ you have to use DXImageTransform.Microsoft.Shadow which creates the illusion of a shadow. Here’s how to use it

IE Shadow Filter

You can also use the Shadow Filter app to achieve the desired effect. It creates CSS markup for you based on the selected values

IE Shadow Filter

Note: In IE9, this feature has been deprecated and the effect of this filter can only be viewed and not printed.

About The Author

Suprotim Agarwal
Suprotim Agarwal, Developer Technologies MVP (Microsoft Most Valuable Professional) is the founder and contributor for DevCurry, DotNetCurry and SQLServerCurry. He is the Chief Editor of a Developer Magazine called DNC Magazine. He has also authored two Books - 51 Recipes using jQuery with ASP.NET Controls. and The Absolutely Awesome jQuery CookBook.

Follow him on twitter @suprotimagarwal.

1 comment:

Anonymous said...

Nice post. Thank you for taking the time to publish this information very informative; so happy to be given a privilege to post a comment here.