CSS3 Pie – Habilita Propiedades CSS3 en Internet Explorer

Tuesday 13 de July de 2010, 1:40 pm 3 Comments

CSS3 Pie LogoCSS3 Pie es una interesante utilería para desarrolladores web, pues permite que Internet Explorer 6 a 8 sea capaz de renderizar correctamente las propiedades decorativas más utilizadas de CSS3.

¿Cómo funciona PIE (Progressive Internet Explorer)? Se trata de un archivo de comportamiento para IE (con extensión .htc) que debemos incluir en el elemento donde queramos aplicar las propiedades CSS3.

CSS3 Pie Demo

Por ejemplo, veamos el siguiente fragmento de código.

#elemento {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

Lo anterior funcionará perfectamente en los navegadores web de primer nivel (como Firefox y Chrome), pero no en Internet Explorer… para obligar a IE a reconocer los bordes redondeados, usaríamos:

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

Así de sencillo. Obviamente, debemos descargar el archivo PIE.htc.

CSS3 Pie por el momento sólo funciona con algunas propiedades CSS3, como border-radius, box-shadow y border-image. Les recomendamos leer la documentación oficial para mayor información.

Via Web Resources Depot.

Share

Post tags