El código que has mandado en Firefox se ve como tú querías.
Si quieres que el tamaño vertical sea estático, prueba este código:
Código:
<html>
<head>
<style type="text/css">
#contenedor { margin: auto;
text-align: left;
width: 960px;
height: 420px;
background-color: rgb(0, 0, 0);
}
#cuerpo { margin: 0pt 0pt 0pt 0px;
color: rgb(84, 98, 125);
}
#lateral { margin: 0pt 0pt 0pt 0px;
background-color: rgb(255, 255, 0);
float: left;
width: 190px;
height: 340px;
}
#otrolado { margin: 0pt 0pt 0pt 0px;
width: 10px;
float: right;
height: 340px;
background-color: rgb(255, 0, 0);
}
#principal { margin: 0pt 0pt 0pt 0px;
background-color: rgb(170, 170, 255);
width: 760px;
float: left;
height: 420px;
}
</style>
<title></title>
</head>
<body>
<div id="contenedor">
<div id="cuerpo">
<div id="lateral"> </div>
<div id="otrolado"> </div>
<div id="principal"><br />
<br />
<br />
hola
</div>
</div>
</div>
</body>
</html>
Sólo he añadido un height de 420px en las capas contendor y principal, y más importante, float: left; en la capa principal. Se ve bien tanto en IE como FF.
Si quieres que el alto sea dinámico según tu contenido, habrá que buscar otra cosa compatible a los navegadores.
Mikel.