BACKBONE {BLOG}

What is CSS3 PIE

CSS3 Pie is a javascript library that renders serveral CSS3 effects in IE 6-9

We have seen many javascript plugins that do this type of trick, but I have to say that CSS3 PIE is currently the best over the web. I have tried using CSS3 PIE on two sites so far and it works very well. (Unfortunately these two sites are still not live yet, I will post the links once we launch)

How To Use THE PIE

To Use the PIE, first you have to download the scripts from the CSS3 PIE official site.

Upload the scripts onto your server and make a call like the following the each class that has the css3 effect:

.shadow
{
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  
  behavior: url(/PIE.htc);
}

That's it! The CSS3 PIE will do the rest for you in IE6-9

Supported CSS3 Features

Currently CSS3 PIE is still in beta version but it works like a charm! and CSS3 PIE now supports CSS3 features like :

• border-radius
• box-shadow
• gradient
• border-image
• rgba
• css3 backgrounds

What's not good about CSS3 PIE

As I made the jquery animation onto the CSS3 PIE div, I found that animating speed isn't actually as good as you see in Firefox, Chrome or other good browsers. When you are using CSS3 PIE, be aware of that!

Demo from Backbone Tech

We recently just re-built Payfirma's website and the CSS3 PIE works very well on this site. You can check ot out by go to http://www.payfirma.com

Visit CSS3 PIE to get more information about how to use it. You can also see some live CSS3 PIE demos

Have Fun! :D