Hacks CSS

Los hacks son «condiciones» que se colocan en la CSS para que cada navegador interprete de modo diferente las órdenes del estilo que nos esté dando problemas, de tal manera que al final consigamos que nuestros diseños no difieran en función del navegador usado por el usuario.

Las dos barras // por ejemplo, son leidas como inicio de comentario en algunos navegadores, pero en el explorer no, lo que hace que se interprete la orden directamente, esta práctica se está haciendo muy común últimamente

h1{
font-size: 12px;
color: #009900;
//font-size: 16px;
//color: #000099;
}

En este ejemplo, internet explorer si leera las órdenes de tamaño de texto 16px y color #000099, los demás navegadores, mostrarán una fuente de 12px y un color #009900.

Otra forma de hacer un hack es con la orden html>body que no es entendida por explorer y si por los demás.

#header {margin-bottom:10px}
html>body #header {margin-bottom:20px}

Para todos los navegadores excepto el explorer, el tamaño del margen, será de 20px.
Otro método seguramente mucho más limpio, es distinguir el navegador desde inicio y ahí mandarle a una u otra CSS.

<link rel = "stylesheet" href = "style.css" type = "text/css" title = "Estilo global" / >

<!--[if lte IE 6]>
<link href = "css/ie6.css" rel = "stylesheet" type = "text/css" media = "screen" >
< ! [ endif ] -- >
<!--[if lte IE 5]>
<link href = "css/ie5.css" rel = "stylesheet" type = "text/css" media = "screen" >
< ! [ endif ] -- >

En este ejemplo estamos diciendo que se cargue una u otra CSS según sea el navegador con el que llega el usuario. Vemos que hay uno por defecto (style.css), uno si el usuario llega con explorer 6 y otro si llega con la versión 5 del explorer.

Personalmente no los utilizo, siempre he conseguido si no dejar el mismo aspecto, al menos casi casi, por lo que prefiero no meter código accesorio, de todos modos lo que si que recomiendo es que si son muchos los comentarios que vayamos a meter, es mucho más aconsejable hacer css separadas y así no recargar la página con un peso innecesario.