Ya vimos como crear bordes redondeados en CSS una vez gracias a CSS Sprites, pero ahora lo haremos para que sea compatible con Internet Explorer, gracias a un archivo .htc.
Pasos para crearlo:
Debemos descargar el archivo .htc, este archivo deberemos incluirlo en la raíz de nuestro FTP (si lo queréis dejar como está por defecto).
Después, metemos este código en el documento donde queramos tener nuestros bordes redondeados (El código consta de una llamada al archivo .htc, y un div con un selector css para llamar al estilo .redondo.)
Código CSS
.redondo {
border.radius: 10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
Ahora, para aplicar bordes redondeados en CSS, deberemos añadir a la clase anterior, esta línea:
behavior:url(border-radius.htc);
Código HTML
El código HTML es:
<div class="redondo">borde redondeado</div>
Listo, ya tendremos nuestros bordes redondeados compatible con Internet Explorer gracias al uso de CSS y un archivo .htc. A continuación se muestra un ejemplo del mismo.
Actualización
¿No funciona la técnica acabo de mostrar en este artículo? Echad un vistazo a las distintas técnicas para crear bordes redondeados, seguro que encontraréis la solución.
Vía | Anieto2k
Por ahora hay 18 comentarios ¿Quieres opinar?
Para aplicar este efecto en Wordpress??
@Ivan se aplican los mismos pasos, solo que la clase (CSS) será otra distinta.
Un saludo.
Hola,
Lo he probado en explorer8 y si lo aplicas a un link hecho bloque no va muy bien…
@Copito, el gato con botas tendrías que pasar el ejemplo para verlo mejor. Si deseas resolver el problema pregúntalo en el foro de CSSBlog.es: http://comunidad.cssblog.es
En enlace para ver el ejemplo no funciona no?
@Lidia el enlace ha sido arreglado.
Un saludo.
Ahora sí! Gracias!
Lo estoy probando y no funciona, de hecho el enlace que publicaron uds. tampoco
@Samael debe funcionar, así que revisa en que te has confundido. Si tienes dudas pregúntalo en el foro: http://comunidad.cssblog.es
Un saludo.
Gracias por responder Pedro, ya me fijé y funciona unicamente en Firefox, que lástima, ese navegador no me gusta, y no me va a gustar.-
a mi solo me funciona en firefox, en explorer no
no se si estoy haciendo algo mal.
Es verdad, en IE no funciona, incluso los ejemplos de esta página… menudo FAIL. Estaría bien que la gente probara las cosas antes de postearlas, he visto ejemplos similares en muchos sitios y tampoco funcionan.
el ejemplo de esta pagina no funciona en explorer, toodo en esta pagina se ve rectangular, FAIL!!!!
deben colocar en el head:
<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ />
para internet explorer 7 y 8. Esto soluciona el problema ya que automaticamente carga la pagina en modo vista de compatibilidad
el enlace para descargar el archivo a caducado, te agradeceria que lo vuelvas a subir por favor , un saludote desde mexico
@dhamasito: ya está arreglado. Un saludo.
[...] Las novedades de CSS3 nos permiten ahorrarnos tiempo y trabajo al poder seguir varias técnicas (bordes redondeados, sombra en el texto, sombra en las cajas, etc) sin necesidad de usar un editor [...]
no funciona el IE6