Foros del Web » Creando para Internet » CSS »

Ayuda con columnas opcionales CSS

Estas en el tema de Ayuda con columnas opcionales CSS en el foro de CSS en Foros del Web. Hola a todos, Tengo un problema que me esta volviendo loco. Tengo una estructura de pagina con encabezado, columna izquierda, contenido, columna derecha y el ...
  #1 (permalink)  
Antiguo 10/09/2009, 18:59
 
Fecha de Ingreso: febrero-2007
Mensajes: 309
Antigüedad: 17 años, 1 mes
Puntos: 16
Pregunta Ayuda con columnas opcionales CSS

Hola a todos,

Tengo un problema que me esta volviendo loco.

Tengo una estructura de pagina con encabezado, columna izquierda, contenido, columna derecha y el pie.

El asunto es que quiero que desde PHP pueda elegir que columna muestro (la izq, la derecha o las dos) o que no muestre ninguna de las dos columnas, y el contenido debe acomodarse para ocupar todo el ancho.

Hice este código, pero cuando el contenido es muy grande se cae, además las columnas no ocupan todo el alto como quiero:

Código HTML:
<html>
<head>
	<style>
	HTML { 
		padding: 0;
		width: 100%;
		height: 100%;
	}

	BODY {
		margin: auto;
		padding: 0;
		width: 100%;
		height: 100%;
	}

	#contenedor{
		width: 760px;
		margin: 0 auto;
		position: relative;
		display: block;
		min-height: 608px;
		height: auto!important;
		background-color: #3F3F3F;
	}

	#encabezado{
		height: 85px;
		position: relative;
		background-color: #171717;
	}

	#contenido{
		position: relative;
		float: left;
		height: auto!important;
		min-height: 503px;
		height: 506px;
	}

	#columna_izq{
		float: left;
		position: relative;
		height: auto;
		width: 180px;
		min-height: 500px;
		background: #232323;
	}

	#columna_der{
		float: right;
		position: relative;
		min-height: 500px;
		height: auto;
		width: 180px;
		background: #232323;
	}
		
	#pie{
		width: 100%;
		position: absolute;
		bottom: 0;
		text-align: center;
		height: 25px;
		line-height: 25px;
		clear: both;
		color: #999999;
		background: #1D1D1D;
	}
	</style>
</head>
<body>

	<div id="contenedor">

		<div id="encabezado">
			encabezado
		</div>

		<div id="columna_izq">
			col izq
		</div>

		<div id="contenido">
			contenido contenido contenido contenido contenido contenido contenido contenido contenido contenido contenido contenido contenido contenido 
		</div>

		<div id="columna_der">
			col der
		</div>

		<div id="pie">
		 pie
		</div>

	</div>

</body>
</html> 
Si me puden dar una pista lo agradeceria :)

Gracias por adelantado!
__________________
Responder encuestas
  #2 (permalink)  
Antiguo 11/09/2009, 08:47
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 1 mes
Puntos: 101
Respuesta: Ayuda con columnas opcionales CSS

Quizas el height: auto; pueda ir como height: 100%; siempre y cuando todos los contenedores que tenga ese sector, hasta llegar a body, tambien tengan declarado height: auto;

Que es caerse?
  #3 (permalink)  
Antiguo 12/09/2009, 06:54
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 21 años, 9 meses
Puntos: 361
Respuesta: Ayuda con columnas opcionales CSS

Hola:

Cita:
Iniciado por mayid Ver Mensaje
Que es caerse?
Según el diccionario de la Real Academia:

caer: Dicho de un cuerpo: Moverse de arriba abajo por la acción de su propio peso, entre otras definiciones.

Yo interpreto que algunos div en lugar de colocarse en su sitio, se "caen" y se colocan debajo.

Saludos.

  #4 (permalink)  
Antiguo 12/09/2009, 08:01
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 10 meses
Puntos: 539
Respuesta: Ayuda con columnas opcionales CSS

Hola Quebien.

Creo que tu consulta y la de este otro tema es básicamente lo mismo.

Mira a ver si mi aporte al mismo te es de ayuda.

Un saludo.

P.D.: tampoco tengo claro el "caerse"
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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




La zona horaria es GMT -6. Ahora son las 08:05.