Vamos a ver, que podríamos estar liando al personal con el asunto del IE7 y los hacks.
Con este código de muestra:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Shade</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<style>
#contenedor { border: 1px solid rgb(255, 102, 0);
width: 200px;
}
.r1 { margin: 0px 5px;
display: block;
background-color: rgb(0, 102, 0);
width: 100px;
height: 100px;
}
.r2 { margin: 0px 3px;
background-color: rgb(0, 204, 204);
display: block;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div id="contenedor">
<div class="r1">Caja R1</div>
<div class="r2">Caja R2</div>
</div>
</body>
</html>
en el que pongo un contenedor para que se note bien el margen, y sin usar ningún tipo de hack para IE7, en firefox e IE7 se ve así:
es decir, idénticos.
Si usamos el hack del asterísco:
* html .r1 {
margin: -1px 5px
}
* html .r2 {
margin: -1px 3px
no ocurre en IE7 absolutamente nada, y sobre todo si no cerramos cada parámetro de cada selector con punto y coma (;), que aunque lo hagamos tampoco ocurre nada, porque efectivamente IE7 no entiende ese hack (lo han eliminado).
Si usamos el comentario condicional:
<!--[if IE 7]>
<style>
.r1 {
margin: -1px 5px;
}
.r2 {
margin: -1px 3px;
}
</style>
<![endif]-->
lo que ocurre es que IE7 produce un error, con el que como se puede ver, se monta el cuadro azul sobre el verde gracias al -1px del comentario:
Es decir, resumiendo:
- IE7 entiende los margenes perfectamente, igual que firefox, sin necesidad de nada raro
- IE7 no entiende el hack del asterísco, tal y como se comenta en infinidad de sitios, incluído este foro.
- El comentario condicional "if IE 7" finciona perfectamente cuando está escrito correctamente, los parámetros finalizados con punto y coma y cerrando antes el style, y luego abriendo-cerrando dentro de él.
Disculpad la chapa que he metido, pero si me he tomado la molestia es porque de ser cierto lo que decía Shade, me estaba descalabrando todo lo que ya creía saber sobre IE7.
Una imagen vale más que mil palabras.
Mikel.
