We all love CSS3 and the things we can do with it. It is saddening when a client opens up the site you just coded and doesn’t see all the CSS3 goodness because they are using some version of IE. Frequently, CSS3 PIE has saved me from the client saying: “Why don’t the buttons have the rounded corners like your design?”
CSS3 PIE makes some CSS3 features work in IE6 – 9. It supports border-radius, box-shadow, and linear-gradient. It works great and is super easy to set up. Unless you use it in WordPress. After some Google searching, a fair amount of testing, and a lot of grumbling I got it working in a WordPress site. It is really simple. I hope that this will save others from some headache.
1. Put the PIE.htc file in the WP Root directory and then reference it in your css as – behavior: url(“PIE.htc”);
2. All the elements that use CSS3 features will need either position: relative or position: block on them