denegro.com

Programar CSS para IE6 a ciegas

March 2nd, 2007 5 comentarios

Una lista rápida que puede servir de referencia (y crecer, y ser corregida), de cosas a tener en cuenta en mi hoja de estilos para que lo que se ve bien en Firefox y similares se vea también bien en Internet Explorer 6:

  • Si un elemento está flotado y tiene márgenes, ponerle display: inline ?
  • Para que un contenedor envuelva a los elementos flotados, usar el holly hack (sobre el contenedor):height: 1%
  • Para evitar problemas con elementos con position:absolute cuyo contenedor con position:relative tiene padding, usar el holly hack (sobre el contenedor):height: 1%
  • Para usar PNGs con canal alfa (semitransparencia), tocar de esta solución.
    Nota 1: si lo puedes evitar, mejor.
    Nota 2: que no se te olvide el gif transparente, que siempre se te olvida.
  • Cuidado con los porcentajes. ?
  • Para evitar problemas con las imágenes de fondo en los elementos de lista: ul, ol, dl {
    position: relative; }

Para aplicarlas, soluciones en 2 sabores:

  • la de la hoja de estilos específica para IE6, vía comentarios condicionales:
    <-- !--[if lt IE 7]>
    <link rel="stylesheet" href="mi-hoja-de-estilos-para-ie6.css" type="text/css" media="screen" charset="utf-8" />
    <![endif]-->
  • la del star html hack:
    * html .miSelector {
    mipropiedad: mivalor;
    }
  • http://www.c-trick.com Cay

    Gracias denegro, buena lista… el punto 3 y 4 estan repetidos, no? :P

  • http://denegro.com alberto

    Sí… lo apaño, que la he hecho a toda prisa… gracias!

  • http://coolrasta.noublog.com openbsd al femenino

    excellente … Solo una correccion …


    deberia ser


    Muchas gracias

    si me lo permites … lo voy a traducir al frances y publicarlo en mi blog coolrasta.noublog.com …ok ?

  • http://coolrasta.noublog.com openbsd al femenino

    lo siento ,pero lo hice mal …

    >-- !--[if lt IE 7]<

    deberia ser

    > !--[if lt IE 7]<

    Muchas gracias

  • http://denegro.com alberto

    Claro, haz lo que quieras, aunque es un poco cutroe la lista, pero guay. Gracias por la corrección, cosas de las prisas.. cheers!