Maquetación con DIV: cabecera, contenido central y menú derecho

[Bravenap]

Muy buenas. He intentado deshacerme de las tablas a la hora de maquetar el contenido de la página y recurrir a DIVs con CSS.

Dentro de una capa centrada en la página horizontalmente de 750 px tengo una cabecera al 100% de la anchura y debajo, dos columnas, una derecha de 530 px y un margen derecho de 10 px y una derecha de 210 px.

El código es:

Código:

<style>
#contenedor
{
	margin: 0px auto 0px auto;
	width: 750px;
	position: relative;
}
#cabecera
{
	margin: 0px auto 5px auto;
}
#contenidos
{
	width: 530px; 
	margin: 0px 10px 0px 0px; 
	float: left;
}
#colDerecha
{
	float:right; 
	width: 210px;
}
</style>
<div id="contenedor">
   <div id="cabecera"></div>
   <div id="contenidos"></div>
   <div id="colDerecha"></div>
</div>

En Firefox perfecto, la columna derecha bien ajustada a la derecha y a la misma altura que la de la de contenidos, pero en Internet Explorer salé más o menos bien ajustada a la derecha (unos pixels desplazada hacia la izquierda) y, lo que es peor, debajo de la columna de contenidos, no a su derecha.

¿Se puede solucionar esto?

Gracias y un saludo.

[Bravenap]

Pues ya está solucionado, usando CLEAR:

Código:

#contenidos
{
	float: left;
	width: 530px; 
	clear: left;
}
#colDerecha
{
	float: right;
	width: 210px;
	margin: 0px 0px 0px 5px;
	clear: right;
}

El margen de la columna derecha es para que en IE los bordes derechos de la cabecera y la columna derecha queden alineados. En Firefox no hace falta pues lo ajusta perfectamente.

Se me olvidó comentaros que estoy utilizando CurvyCorners para las capas que hay dentro de cada una de las secciones, por lo que podría ser que me trastocara un poco todo, aunque no creo. Por cierto, os lo recomiendo, queda bastante bien y es facilísimo de implementar.

Bueno, un saludo y gracias.