Con la llegada de CSS3 cada vez es más común que muchos elementos sean descartados por Internet Explorer en cualquiera de sus versiones.
Elementos con efectos blur
Esquinas redondeados
Lo que nos complica la vida como programadores, sin embargo como expertos en compatibilidad, nos damos a la tarea de buscar la forma de lograr hacer que estos nuevos elementos funcionen.
En caso de que nos lleguemos a encontrar con estas situaciones lo primero que debemos hacer es:
Escribir el codigo de CSS como comun mente lo hacemos:
01
<br />
02
.box {<br />
03
-moz-border-radius: 15px; /* Firefox */<br />
04
-webkit-border-radius: 15px; /* Safari and Chrome */<br />
05
border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */</p>
Adicionalmente debemos contar con el archivo htc (HTML Components) con el que vamos a trabjar (ie-css3.htc, border-radius.htc) el cual será el script encargado de proveer soporte para los elementos que nuestro CSS necesite.
Ejemplo:
1
<br />
2
.curved {<br />
3
-moz-border-radius:10px;<br />
4
-webkit-border-radius:10px;<br />
5
behavior:url(border-radius.htc);<br />
6
}<br />
1
<br/>
2
<div class="curved">Div con esquinas redondeadas</div><br/>
