Menú Cerrar

Hojas de Estilo CSS específico para Internet Explorer

#1 Comentarios Condicionales para IE

Probablemente este sea el recurso mas utilizado para solucionar bugs de Internet Explorer para versiones especificas (IE 6, IE 7, IE 8).

Lo que hace es detectar que versión de IE esta usando nuestro visitante, dependiendo de que versión sea le decimos que cargue determinado estilo.

Aquí te dejamos el ejemplo de como se usa para las diferentes versiones de Internet Explorer.

  • <!--[if IE 8]> = IE 8
  • <!--[if lt IE 8]> = IE 7 y versiones anteriores
  • <!--[if gte IE 8]> = IE 8 en adelante
<!--[if IE 8]>
<style type="text/css">
	/* css para IE 8 */
</style>
<![endif]-->

<!--[if lt IE 8]>
	<link href="ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->

Nota: Fueron creados por Microsoft para su navegador y sólo son soportados por éste.

#2 Reglas de CSS especificas para Internet Explorer (IE CSS hacks)

Otra opción es declarar reglas de CSS que solo puedan ser leídas por Explorer.

Por ejemplo, agregando un asterisco (*) antes de la propiedad del CSS afectará solo al IE7 y agregando el guión bajo (_) afectara solamente al IE6. Sin embargo, estos métodos no son recomendados porque no cumple con los estándares de validación del CSS.

  • IE8 y versiones anteriores: para escribir reglas de CSS específicas para IE8 o versiones antiguas, agrega una backslash y 9 (9) al final, antes del semicolon.
  • IE7 y versiones anteriores: agrega un asterísco (*) antes de la propiedad CSS.
  • IE6: agrega guión bajo (_) antes de la propiedad.
.box {
	background: gray; /* standard */
	background: pink9; /* IE 8 y anteriores */
	*background: green; /* IE 7 y anteriores */
	_background: blue; /* IE 6 */
}

#3 Clases Condicionales en HTML

La tercera opción es agregar una clase al HTML para los que usen Internet Explorer agregando en nuestro código comentarios condicionales. Basicamente lo que hace esto es checkear si se esta usando IE, entonces le agrega la clase al . De esta manera podremos modificar nuestras propiedades CSS para cualquier version de IE (por ejemplo .ie6 .box).

Este es un método bastante interesante y no causa errores de validación.

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class ="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->

Redes Sociales


Publicado en Soporte Tecnico

Te puede interesar...

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *