Compatibilidad en Internet Explorer

[IDRID]

Hola, tengo una pagina a la que quiero que sea compatible con Internet Explorer, he visto una web donde en IE se ve con bordes redondeados y tiene transparencia los divs. Pero no encuentro como lo han hecho xDD!

Mi pagina -> http://idridplanet.blogspot.com/
La pagina -> http://lbp.me/

Gracias ;)

[Daniel Ulczyk]

Iniciado por IDRID

Pero no encuentro como lo han hecho xDD!

Pues, mirá el código fuente. Una pista #19 y #56 a #65 ¡Suerte!

[yuo2]

El Mozilla reconoce tu codigo sin problemas, pero el IExplorer no, tendrias que fijarte que etiquetas de tu css no son compatibles y esas cambiarla para que el navegador iexplorer lo reconosca.
Para eso tendreas que hacer una copia de tu css especialmente para iexplorer.


Fijate el codigo fuente de esa pagina, aqui definen que estilo css va levantar segun el navegador.

Código HTML:

...
<!-- AIIIIII-EEE! -->
<!--[if lte IE 7]>
  <link href="http://i.lbp.me/css/style.ie7.css" media="all" rel="stylesheet" type="text/css" />
<![endif]-->  
<!--[if lte IE 8]>
  <link href="http://i.lbp.me/css/style.ie8.css" media="all" rel="stylesheet" type="text/css" />
<![endif]-->  
<!--[if lte IE 9]>
  <link href="http://i.lbp.me/css/style.ie9.css" media="all" rel="stylesheet" type="text/css" />
<![endif]--> 
...
 

[IDRID]

Iniciado por Daniel Ulczyk

Pues, mirá el código fuente. Una pista #19 y #56 a #65 ¡Suerte!

Ok gracias ;) , he mirado el #19 y he puesto la meta, me he pasado desde la #56 a la #65, pero solo vi propiedades para la alineacion :(

[emprear]

IDRID:

Las propiedades a usar para esos efectos son

opacity (para la transparencia) y border-radius, para el redondeado de los bordes.

Para lo primero, y conseguir compatibilidad con IE7/ IE8 más el resto de los navegadores en sus versiones recientes (incluido IE9), tenes que usar

Código CSS:

opacity: 0.5;
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity:0.5;
 

Para lo segundo,

Código CSS:

-moz-border-radius: 11px;
-webkit-border-radius: 11px;
border-radius: 11px;
 

Esto último no sirve para IE/ IE8, para conseguir el borde redondeado en esos navegadores, tenes que valerte de una script de HTML components, ó .htc
la script y una demo las podes bajar de acá
http://foros.emprear.com/css3/border-radius-htc.rar

Suponiendo que el archivo border-radius.htc esté en la misma carpeta de tu html, tu css sería así

Código CSS:

-moz-border-radius: 11px;
-webkit-border-radius: 11px;
border-radius: 11px;
behavior: url(border-radius.htc);
 

Hay un problema adicional (que no siempre se presenta), que es que los servidores web no reconocen debidamente el tipo mime de los archivos .htc, para solucionar esto, si es el caso, tendría que crear un archivo .htaccess en la misma carpeta y añadirle

Código Apache:

AddType text/x-component htc
 

Si usas Cpanel, también lo podés modificar desde ahí. Y cuando subas el htc al server, hacelo en modo ascii, como texto.



Para finalizar, un comentario personal, el efecto border-radius en IE (cualquiera de sus versiones) no es tan "prolijo" como en el resto de los browsers

Saludos