CSS 3.0 with PIE

07 Oct 2010 Leave a Comment

by edselweb in CSS 3.0 Tags: CSS 3.0, PIE, Progression Internet Explorer

Objective: To recreate a box-shadow using CSS3.0

Problem encountered: CSS3.0 is not widely supported in IE browsers.

Solution: Use Progression Internet Explorer (PIE).

Code Example:

#subNavContainer {

/* css3 shadow styles*/
box-shadow: 2px 1px 3px #000;                 // CSS3.0
-moz-box-shadow: 2px 1px 3px #000;     // for Firefox
-webkit-box-shadow: 2px 1px 3px #000;  // for webkit based browsers like Chrome and Safari
behavior:url(/styles/PIE.htc);                       // Add this for CSS3.0 to work in IEs browsers
}

Download PIE:http://css3pie.com

Advertisement