Contenido

Bordes redondeados en Internet Explorer

5 Dic

+ 6

Jonathan Snook nos cuenta como conseguir bordes redondeados en Internet Explorer de la misma forma sencilla que en cualquier otro navegador. De las opciones que nos muestran, podemos optar por dos tecnologías para conseguirlo:

CSS

En  HTMLRemix han desarrollado un sistema basado en un fichero .htc.

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

// HTML
<div class="curved">Curvd div</div>

Como vemos en el código anterior, tenemos todas las propiedades para conseguir unos bordes redondeados en todos los navegadores. Ya que ninguna de ellas está contemplada por la w3C nos dá exactamente igual que la solución para IE esté basada en un fichero HTC.

border-radius.htc / Descargar Ejemplo

Javascript

DillerDesign nos muestra un sistema llamado DD_roundies() que usa Javascript para generar los bordes redondeados mediante VML basado en un ejemplo que el propio Jonathan publicó hace unos meses.

<script src="DD_roundies.js"></script>
<script>
    DD_roundies.addRule('.box', 10);
</script>

Descargar

Internet Explorer 8

Recordemos que en la versión 8 de Internet Explorer, dispondremos de una nueva propiedad que nos permitirá mostrar los bordes redondeados de nuestros elementos de igual forma que navegadores como Firefox, Opera o Safari.

  • Que simple ha quedado ahora para IE6, gracias!! lo usare =D

  • Muchas gracias por esa valiosa información de cómo usar los bordes redondeados para explorer y mozilla. Eso me ahorrará el uso de imágenes para lograr el efecto redondeado.

    Gracias!!!!!

  • Hola… de nuevo ^^!

    En realidad no he leído la entrada original porque leer el tema de IE8, sinceramente, me ha hecho saltar a los comentarios directamente :S. No obstante, para el caso de Opera, imagino que será algo relacionado con SVG… yo al menos lo hacía así y lo cierto es que es muy cómodo, casi para cualquier navegador.

    En fin… no sé si reír o llorar cuando oigo que IE8 traerá nuevas reglas propietarias para el tema de bordes -no lo digo por ti Andrés, está claro-, es que es increíble macho: IE8, lo que debería hacer siendo un navegador de última generación, beta y aún en producción:
    [voz de Boris ON] es implementar el estándar para bordes de CSS3

    Juro, en serio, que ni lo comprendo ni lo entiendo, y no deja de joderme la desidia de las organizaciones implicadas, siendo M$ parte importante del W3C, y la de los desarrolladores. Algo así debería clamar al cielo.
    ¿Es que no pueden desarrollar un navegador estándar… y punto, y dejarse de «chominás»?, ¿es que no van a parar en la vida?

    No se puede comparar a desarrollos como por ejemplo Firefox, u Opera… incluso Safari, que se actualiza de mes en mes a lo sumo. Estos desarrollos pueden implementar CSS3 en cuanto haya un borrador más o menos estable…
    ¿¿¿pero IE???, joder, aún seguimos con IE6 y sin una puta actualización en algunos sistemas.

    ….buffff, bueno, siento el calentón y nadie aquí tampoco tiene la culpa como es lógico ^^!

    En fin, una ruina los capullos estos de M$, es que no se les puede apreciar ni esforzándose :S
    Un saludo.

    PD: jQuery lo hace muy fácil en varios de sus proyectos pero en todos hay algún tipo de problema con los espaciados… además de la sobrecarga que conlleva cualquier solución JS.

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.