igualar 2 alturas de capa

[sciffo]

Buenas.
Tengo una capa contenedor y otra capa dentro del contenedor. ¿Cómo puedo hacer que la capa de dentro iguale la altura de la capa contenedor?
Me explico: la capa contenedor tiene una altura variable pues recoge información de la BBDD y luego la capa de dentro me interesa que siempre tenga la altura de la capa contenedor.

Actualmente tengo puesto esto:

#contenedor { float:left; background-color:#FFFFFF; width:780px; font-size:11px; border-left:1px solid #000000 }

#capadedentro { float:left; width:400px; padding:0px; height:100%; background-color:#F3F3F3 }

[talmente]

¿En que navegador no lo ves bien?. Yo lo veo bien de hecho puedes quitar el alto de 100% que tiene la #capadedentro

[Calizman]

intenta ponerle paddin: 0 al contenedor... de ahi todo lo demas lo veo bien... xD

[Mikmoro]

¿Pero qué es lo que veis bien ambos? ¿donde me he perdido?

Con el código que ha puesto es imposible conseguir lo que quiere hacer. Hay algo que me debo estar perdiendo.

[talmente]

Yo veo una capa que ocupa todo el alto del contenedor

Código HTML:

<div id="contenedor">

<div id="capadedentro"><p>Bachoir-Caparó Foundation se constituye en la ciudad de Los Angeles, en septiembre 11, 2006 como una organización no lucrativa. Registrada bajo la leyde corporaciones del Estado de California como una entidad de beneficio público y opera exclusivamente con propósitos educativos y benéficos dentro del marco de la sección 501©(3) del Departamento de Recaudación de Impuestos en Los Estados Unidos.</div>

</div> 

Código:

#contenedor {
	float:left;
	background-color:#009966;
	width:780px;
	border-left:1px solid #000000
}

#capadedentro {
	float:left;
	width:400px;
	background-color:#0099CC;
	padding-right: 0px;
	padding-bottom: 0px;
}

[Mikmoro]

Bueno, yo lo digo porque dice:

Me explico: la capa contenedor tiene una altura variable pues recoge información de la BBDD y luego la capa de dentro me interesa que siempre tenga la altura de la capa contenedor.

Lo que parece indicar que el contenido no está en la capa de dentro, sino fuera de ella, y que ésta está a su vez dentro de "contenedor", al igual que la información y a su lado.

Igual me equivoco.

[talmente]

Bueno Mikmoro, esperemos que el interesado lo aclare, si es lo que tu dices ciertamente con lo que pone es imposible.

[Calizman]

Yo veo que el compañero que pregunto ya se nos escapo... y solo nos dejo la gana de ver como le quedo... jaja... bueno... en todo caso si regresa, PON TU CODIGO!

Saludos y Suerte

[sciffo]

No he podido conectarme estos días, pero gracias a todos por la respuestas.
Aún no he conseguido dar con la solución, pero va en el sentido de lo que dice Mikmoro, es decir:
la capa "contenedor" recibe información de la base de datos (noticias en este caso), por lo tanto su altura es variable. Lo que me interesa es que la capa "capadedentro", que tiene un color de fondo diferente (y donde cargo una imagen) siempre iguale la altura de la capa contenedor para conseguir 2 columnas iguales (en altura).
El código es el que puse más arriba, pero no encuentro la manera de hacer esto...

[talmente]

Esta es una de las mejores soluciones que yo conozco, pero tendrás que hilar fino por que no es fácil, sobre todo por que tu solo necesitas dos columnas. Tienes que entender el ejercicio y después adecuarlo a lo que tu necesitas.

http://matthewjamestaylor.com/blog/e...r-css-no-hacks

[sciffo]

Eso es!!!!!

Miro a ver si lo entiendo bien y lo puedo adaptar a mi código, pero esto es lo que andaba buscando... Muchas gracias!!

[talmente]

Me alegro de que te guste. saludos

[koma42]

Pues yo intento adaptar ese ejemplo a mi web pero no hay manera. Tengo el mismo problema , mirad en el IE lo que ocurre aquí www.tercerainformacion.es/3iv2
Quiero aliear los tres div en el centro y el tercer div se queda debajo del primero
El css es el siguiente:

#cuerpo{
background: #fff url(../imagenes/cuerpo.png) repeat-y;
width:1009px;
margin:0 auto;
padding:0;
}

#cabecero{
background-image: url(../imagenes/header.png);
width:1009px;
height:100px;
text-align:left;
}


#contenido
{
width:1009px;
background:#fff;
float:left;
}
#col_izq{
width:390px;
background:#fff;
float:left;
}
#col_centro{
width:230px;
background:#fff;
float:left;
}
#col_dcha{
width:367px;
background:#fff;
float:left;
}

y el HTML :

<div id="cuerpo">
<div id="cabecero"></div>
<div id="contenido">
<div id="col_izq"></div>
<div id="col_centro"></div>
<div id="col_dcha"></div>
</div>
</div>

[talmente]

Tu web no tiene nada que ver con el ejemplo, pon un doctype.

Edito: la imagen fotozona.png es muy grande, entre otros problemas.

[koma42]

Perdonad que lo haya resumido el código tan mal. Por eso también incluí la dirección real de la web , para que pudierais comprobar completo.
Mi doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Edito: Cambiando el doctype me funciona, muchas gracias compañero!!

[talmente]

es un placer amigo!