IE-CSS3 is a script to provide Internet Explorer support for several of the popular new styles available in the upcoming CSS3 standard.
How it works

If you’re viewing this page in Internet Explorer, some of the elements have been rebuilt by the script in Vector Markup Language (VML), an IE-specific vector drawing language. VML supports things that are missing from IE’s CSS implementation like rounded corners and blur effects.
How to use it

Just add CSS styles as you normally would, but include one new line:

.box {
-moz-border-radius: 15px; /* Firefox */
-webkit-border-radius: 15px; /* Safari and Chrome */
border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */

-moz-box-shadow: 10px 10px 20px #000; /* Firefox */
-webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */

behavior: url(ie-css3.htc); /* This lets IE know to call the script on all elements which get the ‘box’ class */
}

Issues and Workarounds

You will probably run into issues with z-index, especially if embedding one IE-CSS3 enabled element inside of another. There are two simple workarounds:

* Set the z-index of the IE-CSS3 element to a number larger than its surrounding elements.
* Make sure the IE-CSS3 element is positioned, such as with position: relative or position: absolute

Styles and their status
Style What works What doesn’t work
border-radius

* Setting a radius for all four corners
* Element borders

* Setting a radius for individual corners separately

box-shadow

* Blur size
* Offset

* Any color other than #000

text-shadow

* Blur size
* Offset
* Color

* The shadow looks a little bit different than it does in FF/Safari/Chrome, I’m not sure why