Comunidad de diseño web y desarrollo en internet online

div vertical que acupe 100% del div contenedor

Citar            
MensajeEscrito el 23 Mar 2009 02:17 pm
Hola gente!
Alguien sabe como hacer lo que pongo en el asunto?
Mi caso es el siguiente:

Tengo un div contenedor donde hay 3 divs mas adentro con flote y dos de ellos (los de ambos costados) simulan las sombras y el div que está en el medio es donde se desarrolla el contenido.

Pero bueno no logro que las sombras se extiendan hasta el final del div contenedor, porque supuestamente tendrían que ir acompañando a la extension del div de medio donde está el contenido, me entineden?

Mi css está así ahora:

Código :

/*contenedor*/
#wrapper_content_in{
   width:884px;
   margin:0;
   padding:0;
   height:100%;
}

/*sombra derecha*/
#shw_left_img3{
   float:left;
   width:12px;
   height:100%;
   background-image:url(../images/shw_left.png);
   background-repeat:repeat-y;
   display:inline;
}

/*sombra izquierda*/
#shw_righ_img3{
   float:right;
   width:12px;
   height:100%;
   background-image:url(../images/shw_right.png);
   background-repeat:repeat-y;
   display:inline;
}

/*contenido*/
#wrapper_content_habit{
   margin:45px;
   width:771px;
}


Y queda así:


Si alguien me quiere ayudar se lo agradezco muuuucho!!!!
Lu

Por solo_lu

22 de clabLevel



Genero:Femenino  

firefox
Citar            
MensajeEscrito el 24 Mar 2009 01:59 pm
No te entiendo muy bien la verdad. ¿Podrías ser un poco más claro?

Por euforia

2 de clabLevel



 

Murcia

firefox
Citar            
MensajeEscrito el 24 Mar 2009 03:54 pm
Si te entendi bien creo que la solucion seria alguna de estas:

la mas facil.
1- En lugar de usar 2 divs para la sombra, creas un div que envuelva el contendio y a ese div le pones un
background que sea del total del ancho del contenedor mas las sombras x 10 px de alto por ejemplo.
Que se repita en y. Y overflow:hidden.
Adentro de este estaria tu contenido en otro div. A medida que el contenido se estire hacia abajo fuerza al div que contiene la sombra a ir hacia abajo, y el background se repite en y, asi que se estira junto al contenido.
Un ejemplo de como deberia ser ese jpg te dejo aqui:
[url=http://www.rstringa.com.ar/muestra/fondo_sombra.jpg][/url]
La parte gris es donde despues iria tu div contenido.
Es muy simple , creo que se entiende.

2- Podes probar con esto

#div1, #div2, #contenedor {padding-bottom:32767px; margin-bottom:-32767px;}

Por supuesto los nombres de los div son los nombres de tus 3 divs.

Igualmente la primera es la mas simple y confiable.

Espero te sirva suerte.

Por robertostringa

13 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Mar 2009 11:57 am
Si entendí perfecto robesrtostringa!! era cuestion de amañarse un poco parece pero por ahí tenemos la cabeza tan quemada que nos complicamos la vida.

Te agradezco un montón!!
Besos
Lu

Por solo_lu

22 de clabLevel



Genero:Femenino  

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.