CSS3 en Internet Explorer

Es lamentablemente muy sabido por todos nosotros que el Internet Explorer en casi todas sus versiones no se lleva demasiado bien con muchas de las propiedades nuevas de CSS3, algo bastante malo para los desarrolladores web que tienen que lidiar a diario con la incompatibilidad cruzada entre los distintos navegadores.

Por ejemplo, podemos consultar la tabla de compatibilidad CSS3 con los distintos navegadores, para encontrar que IE no soporta Gradientes, bordes redondeados ni sombras, propiedades que son súper útiles y que ahorran muchísimo tiempo.

Para resolver este gran inconveniente un grupo de diseñadores creo CSS3 Pie, un pequeño complemento para nuestros códigos que amplia automáticamente la capacidad de interpretar CSS3 del Internet Explorer.

Por ejemplo:

#myElement {
    background: #EEE;
    padding: 2em;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;
    behavior: url(PIE.htc);
}

Agregando behavior: url(PIE.htc); finalmente tendremos nuestros hermosos bordes redondeados sin necesidad de imágenes en Internet Explorer. Algo que muchos de nosotros agradeceremos enormemente.

Actualmente CSS3 Pie da soporte total o parcialmente para las siguientes propiedades:

  • border-radius
  • box-shadow
  • border-image
  • multiple imagenes de fondo
  • Linear-gradient como imagen de fondo

Este proyecto recién comienza, por lo que irán incorporando nuevas propiedades a medida que vaya progresando.

Web: CSS3 Pie

Categorizado en: