Foros del Web » Creando para Internet » CSS »

Divs anidados

Estas en el tema de Divs anidados en el foro de CSS en Foros del Web. Hola! Llevo rato y no lo consigo, tiene que ser una tonteria. Tengo un subcontenedor, que tiene otro div. Pero este último esta FUERA de ...
  #1 (permalink)  
Antiguo 06/01/2009, 12:09
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 9 años, 3 meses
Puntos: 1
Divs anidados

Hola!

Llevo rato y no lo consigo, tiene que ser una tonteria.
Tengo un subcontenedor, que tiene otro div. Pero este último esta FUERA de mi subcontenedor. Quiero que esté dentro, así, si me crece el segundo div, el primero tambien. Puedo parchearlo y poner una altura fija, pero no me parece buena idea, ya que entonces para cada página tendré que controlarlo con JS. A ver si me podeis ayudar. La página es http://tecnotortest.site50.net

Código html:

Código:
<div id="subContainer" name="subContainer"> 
		Aquí irá la info general, cambiar el fondo negro y color letra, añadir footer y linea bottom! el texto tendra sombra con div fuera!
<br>
		<img id="imges" src="prova.jpg">
		
		<div id="a"> <div id="b"> <div id="c"> <div id="d"><div id="i"> 
		<div id="texto">post-it de contenido-informacion, hay que cambiar de blanco a negro o sacar relieve para que solo sea sombra</div> 
		</div></div> </div> </div></div>
		
		</div>
CSS:

Código:
#subContainer{
	padding-top: 30px;
}



#a, #b, #c, #i {
	position: relative;
	bottom: 1px;
	right: 1px;
	width: 200px;
}

#i { background-color: #ff2d2d;}
#d { background-color: #AAA;}
#c { background-color: #C3C3C3;}
#b { background-color: #DCDCDC;}
#a { background-color: #808080;
	margin: 20px;
	float: right;
}
#texto {
	color: #000;
	padding: 6.5px;
	position: relative;

}


PS: Me he mirado la migración sin dolor pero debo haber combinado algo mal porqué no me sale =S
PS2: Me da hasta verguenza preguntar esto xD

PS3: Gracias!

EDITO: Mientras le he puesto un alto fijo al subcontainer, pero supongo que el problema se ve igual:P Necesito que ese postit sea dependiente del subcontainer:P

Última edición por samy4ever; 06/01/2009 a las 13:05
  #2 (permalink)  
Antiguo 06/01/2009, 14:21
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Divs anidados

Si he entendido bien, quieres que los div a, b, c, d, i y texto que forman el recuadro esten dentro del div subcontainer ¿no?

entonces crea este div en el CSS:

#corte{clear:both;}

y en el HTML:

despues de cerrar el div a y antes de cerrar el div subcontainer incluye esto:

<div id="corte"></div>

debería funcionarte.

Saludos.

  #3 (permalink)  
Antiguo 06/01/2009, 15:18
 
Fecha de Ingreso: agosto-2008
Mensajes: 143
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Divs anidados

Sí, entendiste bien y funciona perfectamente, gracias jomaruro!

He buscado un poco para que sirve el clear:both, pero no he acabado de entenderlo al 100%. Podría entenderlo como que hace que el div de corte quede enmedio, siempre, de los dos divs subyacentes (y de esta manera lograr que uno esté dentro de otro)?

Muchas gracias, saludos!
  #4 (permalink)  
Antiguo 07/01/2009, 14:10
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Divs anidados

Me alegro que te haya funcionado, en la página www.librosweb.com hay un libro muy bueno sobre CSS (que te puedes descargar gratis o verlo online), mírate el capítulo 5.7, concretamente la página 88 (la acabo de mirar no es que me lo sepa de memoria, jajaja) ahí te viene una explicación sobre clear.

Saludos.

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 09:22.