Componer un diseño a base de estilos .css y que éste se vea bien tanto en Internet Explorer como en el Mozilla se puede convertir en un rompecabezas.
Estadísticamente, casi el 70% de los usuarios de Internet utilizan el Explorer (principalmente porque es el navegador que viene con Windows) y el segundo explorador más utilizado es el Mozilla Firefox.
Sabiendo estos datos, no nos queda más remedio que tener en cuenta cómo se ve la página en distintos navegadores. Lo ideal es crear una sola hoja de estilos css que sirva para ambos casos, pero si el diseño es “complicado” y no llegamos a un empate en una sola de hoja de estilos, podemos hacer el siguiente truco del almendruco…
- Creamos la hoja de estilos principal. Mozilla la interpretará correctamente porque cumple con los estándares redactados por la W3C.
- Para salvar las diferencias con el Explorer, crearemos una hoja de estilos que contenga las especificaciones para una óptima visualización de la página en Internet Explorer.
estilo.css: declaración de todos los estilos de la web.
cssIE.css: estilos para Explorer
- Añadimos en el HEAD el siguiente código:
<link rel=”stylesheet” type=”text/css” href=”estilo.css”>
<!–[if IE]>
<link rel=”stylesheet” type=”text/css” href=”cssIE.css”>
<![endif]–>
Sólo se cargará la hoja de estilos cssIE.css si el usuario está usando el Microsoft Internet Explorer como navegador.
