Adding CSS3 to Moodle 2.1: Yes even for Internet Explorer

Inside of my custom theme for Moodle, I've create some nice enhancements to my design through the use of gradient backgrounds, rounded corners, shadows for text and other elements. Sounds great right?

Unfortunately, Internet Explorer 6 - 8....maybe even 9......doesn't natively support those features. So while spending some time on google, I found a great solution:  pie.
No, really.
There is a plugin created to enhance the capability of IE6+ with CSS3 features.
It is called 'PIE' : Progressive Internet Explorer.
http://css3pie.com/

It has support for the following features:

border-radius

box-shadow

border-image

CSS3 Backgrounds (-pie-background)

Gradients

RGBA Color Values

PIE Custom Properties

• -pie-watch-ancestors
• PNG alpha transparency and -pie-png-fix
• Lazy Initialization (-pie-lazy-init)
• Layout polling (-pie-poll)

It's quite simple to use as well. Simply place the script within your project, and add one line of code to your CSS like this:

#myelement
{
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius:10px;
  behavior: url(path/to/PIE.htc);
}

One thing that it is lacking right now is support for text-shadows. So here is another script that can be used for that:
http://fetchak.com/ie-css3/

Same type of concept. Inside your CSS file, declare your text-shadow like normal. Then simply provide a link to the behavior like so:

#myelement
{

       text-shadow: 1px 1px 1px #888888;
       behavior: url(path/to/ie-css3.htc);

}


As an extra precaution, I went inside the file and commented the box-shadow and radius functions (lines 281-282) -- I didn't want those to overlap with PIE, which look a little better than this wrapper.
NOTE: I don't think the above code will work with em sizes, only with px (Haven't tested this yet)

Hope this was an inspiration to others!