Foros del Web » Creando para Internet » CSS »

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

Estas en el tema de Maquetación con DIV: cabecera, contenido central y menú derecho en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 30/07/2007, 07:30
Avatar de Bravenap  
Fecha de Ingreso: noviembre-2002
Ubicación: Los Arroyos, El Escorial, Madrid
Mensajes: 2.084
Antigüedad: 15 años, 1 mes
Puntos: 4
Maquetación con DIV: cabecera, contenido central y menú derecho

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.
__________________
¡¡NO A LA GUERRA!!
Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares!
  #2 (permalink)  
Antiguo 31/07/2007, 03:28
Avatar de Bravenap  
Fecha de Ingreso: noviembre-2002
Ubicación: Los Arroyos, El Escorial, Madrid
Mensajes: 2.084
Antigüedad: 15 años, 1 mes
Puntos: 4
Re: Maquetación con DIV: cabecera, contenido central y menú derecho

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.
__________________
¡¡NO A LA GUERRA!!
Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas (incluyéndote)




La zona horaria es GMT -6. Ahora son las 19:53.