CSS3 with PIE

3824817756 25e3efcb2a m

CSS3 with PIE

Some of the advantages of CSS3 are that you can now create effects on your page with code that used to require images. Not making calls to the server for your sites decorations can greatly increase page load times. Unfortunately, no versions of Internet Explorer available today can handle these new advances in CSS. IE9 will support most of the new features, but that has yet to be released and since it will only run on newer versions of Windows, developers will have to rely on using images to make their sites look consistent across browsers. There are proprietary filters that you can use on IE, but they are difficult to implement. Recently a new package been released that can handle many of the new CSS3 features without resorting to code in IE's format. CSS3 PIE (Progressive Internet Explorer) allows you to write your normal CSS3 code in one stylesheet and then include a path to the filter using the behavior property. All you have to do is write your code like you normally would, make another reference to the standards compliant format and then add behavior: path/to/PIE.htc; and the filter does the rest. Now you can have box shadows, rounded corners and other CSS3 properties without having to use images or a separate javascript to achieve the same results. There are some drawbacks, PIE doesn't support all of the CSS3 features that are available to other browsers. Since it is javascript, if javascript is disabled the new effects won't be available. When using in Drupal, you will need to include the path to PIE that is relative to the page, not the stylesheet. So if you place the file in your theme folder you would write the path out as /sites/all/themes//PIE.htc. Other CMS's may require the same method. Have you used PIE in your CSS styling? What did you think?

Related Posts

CSS with Less.js

Tom Nelson
Read more

Design Trends 2016: The Good, The Bad, and The Outdated

Felipa Villegas
Read more

How to Launch an MVP Website - a Real-World Example

Tom McCracken
Read more

New Google Anaytics Data Retention Controls: Who, What, Where, When and Why

Kassandra Amper
Read more

The Best Gravity Forms Google Analytics Tracking How To?

Tom McCracken
Read more

Track Contact Form 7 with Google Analytics Goals the Easy Way

Tom McCracken
Read more