Pues entonces debo estar perdiendo la cordura. En esta dirección:
http://club.telepolis.com/cjenlaweb/principal1_css.htm he subido un ejemplo de lo que comento, cuyo html es este:
<html>
<head>
<link rel="stylesheet" type="text/css" href="estilo_cj5.css">
<title>Prueba 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="contenedor">
<div id="banner"><p class="rotulo">www.ciudadjardinmalaga.es</p></div>
<h1>prueba de principio</h1>
<div id="columnas"></div>
<div id="footer">
<h2>bajo esta banda de color no se ve color de fondo del body con IE, pero si se ve con FF</h2>
</div>
</div>
</body>
</html>
en esta otra
http://club.telepolis.com/cjenlaweb/principal2_css.htm he puesto el segundo caso, cuyo html es
<html>
<head>
<link rel="stylesheet" type="text/css" href="estilo_cj5.css">
<title>Prueba 2</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="contenedor">
<div id="banner"><p class="rotulo">www.ciudadjardinmalaga.es</p></div>
<h1>prueba de principio</h1>
<div id="columnas"></div>
<div id="footer">
<h2>bajo esta banda de color SI se ve color de fondo del body con IE y FF</h2>
</div>
</div>
</div>
</body>
</html>
Entre el primer y segundo html solo varía que hay un </div> más en el segundo que en el primero, al final justo antes de </body> y si véis el primer enlace con IE y Firefox veréis que el margin inferior no se ve con IE. En cambio en el segundo enlace se ve el margin tanto con IE como Firefox.
La hoja de estilos es esta:
body {
background-color: #a69698;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
padding:0px;
margin:0px;
text-align: center;
}
h1 {
font-size: 11px;
text-align:left;
text-transform:uppercase;
background-color: #E0A3B7;
border-top:1px solid #564b47;
border-bottom:1px solid #564b47;
padding:2px 15px;
margin:0px;
}
h2 {
font-size: 11px;
text-align:right;
background-color: #E0A3B7;
border-top:1px solid #564b47;
border-bottom:1px solid #564b47;
padding:2px 15px;
margin:0px;
}
#contenedor {
width: 80%;
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
margin-top: 20px;
background-color: #FFFFFF;
text-align:center;
}
#banner {
height:70px;
background-image:url(imagenes/banner.jpg);
background-position: right;
background-repeat: no-repeat;
padding: 0px;
margin: 0px;
}
.rotulo {
font-size:28px;
font-weight:normal;
font-family: verdana;
color:#00825F;
text-align:left;
padding:12px 10px;
margin:0px;
}
#columnas {
width:100%;
height:600px;
background-color: #FFF2D3;
}
#footer {
clear: both;
margin: 0px;
padding: 0px;
text-align: right; }
Sabéis a que se puede deber esto?
Perdonad por lo extenso de mi post.
Saludos
