Compensate for Internet Explorer with PIE

As a developer or designer, you probably know that not all browsers (especially not all older versions of browsers) have support for all the nifty CSS properties. In particular, older versions of Internet Explorer that are still in pretty wide use don’t always have support for some pretty common properties, such as border-radius, linear-gradient, and box-shadow. If you use vendor prefixes, however, you can usually get those properties supported.

If you’re still having trouble getting the properties mentioned above supported on Internet Explorer, then you can use the super handy tool called CSS3 PIE (PIE is an acronym that stands for Progressive Internet Explorer) that will allow to add your own pie vendor prefixes to your CSS code to enable support for the border-radius, linear-gradient, border-image, multiple background image, and box shadow properties.

 

With the CSS3 PIE too you’re getting access to the appropriate vendor prefixes because the tool allows you to link to the PIE library using the behavior property for instances in which versions of Internet Explorer (versions 6-9, specifically) don’t support any of the properties mentioned above. To use PIE in this way, all you need to do is download the files, install them onto your project, and make sure that you reference their correct path when you link to them in the behavior property. See the snippet below for an idea of how this should be done: