Blog: Diseño web
Inicio > Blog > Diseño web
¿Sabías que puedes aplicar CSS “sólo para IE6″?
Publicado el: 14/09/2009 en: Diseño web | 10 comentarios
Internet Explorer 6 suele dar bastantes problemas con el tratamiento de márgenes y paddings, entre otros. Lo que se ve bien en Firefox o Safari se mueve unos píxeles en IE6, cuando se ve correcto en IE6 se ha descolodado en IE7 y Firefox … ¡grrr!
Solución:
Si ponemos un “guión bajo” _ antes de un estilo, todos los navegadores pasarán por alto esa línea, salvo IE6 que lo tomará por valido.
Valiéndonos de este “fallo de programación de IE6″ podemos aplicar un estilo (margin:10px; por ejemplo) para el común de los navegadores y en la línea siguiente aplicar ese mismo estilo solamente para IE6 (_margin:14px; por ejemplo).
Ejemplo:
.MiCapa {
width : 200px;
height : 200px;
border:1px solid RED;
_width : 220px;
_height : 220px;
_border:1px solid BLUE;
}
Todos los navegadores dibujarán lo que se manda en las 3 primeras líneas de la clase “MiCapa” pero Internet Explorer 6 dibujará lo que se expicifica en las 3 últimas, al ir los estilos antecedidos por _.
* Ojo : Las líneas para IE6 han de ir siempre en último lugar
* Es posible que el validador W3C se queje de tu hoja CSS, que lo sepas
(3 voto(s), media: 4.00 sobre 5)
Deja tu comentario10 Comentarios
Laura
14/09/2009
Qué truco más interesante, sobre todo por lo fácil que es
¡gracias!
Vane
14/09/2009
lo suyo es que la hoja de estilos no necesite de trucos; esto se puede lograr, pero da muchísimos quebraderos de cabeza, es un infierno…
lo de duplicar información para que nuestro html se vea bien en ie6 es súper útil si tenemos una css más o menos manejable, pero cuando tienes una css de 1800 líneas y creciendo no puedes duplicar información; conclusión o te rompes la cabeza para que un mismo código valga para todos los navegadores (que ya digo que es posible aunque acabes madiciendo a todo lo que se mueva) o pones un bonito cartelote de “CÁMBIATE A IE7″…
solución que todos los que sufrimos el crossbrowsing desearíamos implementar XD
¡por un mundo sin ie6!
Angel Diez
14/09/2009
je je, Totalmente de acuerdo Vane, pero no me negarás que la técnica está de lujo eh ?
Laura
14/09/2009
a propósito de lo que dice Vane:
http://www.ie6nomore.com/
Chema
16/09/2009
¿Y qué ha sido de nuestro amigo ?
Además, el hack del guión bajo canta al validar la hoja de estilos.
Aunque para cositas pequeñas es útil, gracias por el aporte.
Chema
16/09/2009
vaya, parece que se ha tragado el código.
Repito la pregunta: ¿Qué ha sido de nuestro amigo
Chema
16/09/2009
Nosi al final no voy a poder ponerlo.
Me refiero al
Chema
16/09/2009
jejejeje no hay forma jejejeje
Mario
26/10/2010
Excelente funciona perfecto
Angel Diez
26/10/2010
Me alegro Mario de que te haya servido, ten en cuenta únicamente que no pasa el validador W3C, que lo suyo será cargar una hoja hoja de estilos propia para IE6, pero sirve muy bien para maquetar rápidamente.
Deja tu comentario
Tags HTML Permitidos:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>