Loading ... La definición de “Hack” es si más bien curiosa, pero aporta un idea de lo que vamos a hacer: Cortar a hachazos
Los hacks se usan básicamente cuando nos encontramos con la desagradable situación que un navegador aplica unos estilos de forma diferente a cómo lo hace otro. Esto viene dado a que dichos navegadores traen unos estilos “de base”, que si previamente no se han neutralizado, nos darán estas diferentes interpretaciones (debido a que no se han seguido los estándares W3C).
Cuando esto ocurra, puedes o bien resetear los estilos (una práctica que es conveniente hacer desde un inicio, pero que si te ocurre a mitad de proyecto puede no ser la mejor opción), o aplicar un Hack de CSS. ¿Cómo se aplica? Fácil, sólo hay que ver con qué navegador nos está dando problemas y añadir una lÃnea de código que le diga al navegador: “Y para este caso concreto, aplÃcame este otro estilo”.
Pongo un ejemplo:
h1 {padding-left:50px;}
* html h1 {padding-left:20px;}
Aquà estamos diciendo que se aplique a los tÃtulos h1 un relleno izquierdo de 50 pÃxels, pero si el navegador es Internet Explorer 6 (o una versión inferior) el relleno a aplicar deberá ser de 20 pÃxels.
Efectivamente, esto no tiene más misterio. Sólo hay que añadir una lÃnea con el “prefijo” que indique a qué navegador ha de aplicarse y listos!
Esta es la lista que te indica qué código aplicar para cada combinación de navegador posible.
Â
| Navegador | Prefijo | Ejemplo |
|---|---|---|
| IEÂ 7 | *:first-child+html {} | *:first-child+html ul li {} |
| IEÂ 6 (e inferiores) | * html {} | * html ul li {} |
| IEÂ 7 y FireFox | html>body {} | html>body ul li {} |
| FireFox | html>/**/body {} | html>/**/body ul li {} |
| Safari | Â /**/ html* {} |
 /**/ html* ul li {} |
| Opera | html:first-child {} | html:first-child ul li {} |
Etiquetas: CSS, Maquetación
