adaptar body al contenedor

[Blashak]

Buenas,

Quiero que mi div ocupe toda la web y para eso le aplico la siguietne regla css.

Código CSS:

html,body{
 
margin:0px;
 
height:100%;
 
}
 
body{
background:blue;
}
 
#div{
    
    margin:auto;
    padding:0;
    width:460px;
    height:100%
}
 

el problema esta cuando el div es demasiado alto y se genera el scroll entonces el div continua pero el body no. ya que el body se adapta a la etiqueta html.

Como se logra esto??.

Saludos

[IsaBelM]

como se logra qué??

si al bloque le asignas el 200% el body tomará el 200%. o lo que es lo mismo el fondo del body (azul) ocupará todo el alto del bloque

[Blashak]

Iniciado por IsaBelM

como se logra qué??

si al bloque le asignas el 200% el body tomará el 200%. o lo que es lo mismo el fondo del body (azul) ocupará todo el alto del bloque

si eso es verdad que el body siempre se ajusta al div. pero que pasa si tenes dos div.

Código CSS:

html,body{
 
margin:0px;
 
height:100%;
 
 
  padding: 0; 
}
 
body{
background:blue;
margin:auto;
    padding:0;
    width:100%;
    color:#8a8a8a;
    background:blue ;
}
 
#div{
    
    margin:auto;
    padding:0;
    width:960px;
    background:red url(../img/main_bg.gif) repeat left top;
    height:100%
}
 
#div2 {width:900px; height:800px; margin-left:30px; background:yellow ;}
 

el div de color rojo se tendria que ajustar al div2 pero no es asi el div2 sobre sale del div.

les dejo una imagen
http://img36.imageshack.us/i/dibujolli.jpg/

[edwines]

Tienes razón, debería adaptarse... ¿en qué navegador estas trabajando?

[GAST0N]

como es el codigo html? podrias dejarlo

[ArturoGallegos]

si tu especificas una altura este div la tomara y le importara poco si hay mas contenido o no... sean px o sea porcentajes este se comporta igual, hasta aqui vamos bien?

el 100% de altura es con respecto a su contenedor o en su caso el navegador ya que es tu div principal donde meterás todo el sitio, estas de acuerdo?

tu le has indicado que tome el 100% y eso hace, si el contenido excede la altura disponible este div no tiene porque crecer ya que tu le has dicho tome solo el 100% de altura y el te obedece.

si necesitas que tenga el 100% de altura y si el contenido es aun mas extenso siga creciendo utiliza min-height:100%;height:auto; con esto le indicas la altura mínima debe ser 100% pero si necesita crecer tiene toda la libertad de hacerlo.

[IsaBelM]

el bloque #div se adapta a la ventana, para que se adapte al contenido has de cambiar el valor de la propiedad heigh a auto

perdona Ag666, tuve que atender a algo y no me di cuanta que ya habías respondido

[memoadian]

Código CSS:

#div{
    margin:auto;
    padding:0;
    width:960px;
    background:red;
    height:100%;
    overflow:hidden;
}
 

[ArturoGallegos]

Iniciado por IsaBelM

perdona Ag666, tuve que atender a algo y no me di cuanta que ya habías respondido

Hola IsaBelM un gusto encontrarte por estos rumbos ñ.ñ

Iniciado por memoadian

Código CSS:

#div{
    margin:auto;
    padding:0;
    width:960px;
    background:red;
    height:100%;
    overflow:hidden;
}
 

Compañero @memoadian ha visto usted lo que pasa si agrega la propiedad overflow hidden ???

el div contenedor sigue ocupando el 100% de altura y el contenido excedente simplemente no lo mostrara.

[memoadian]

yo veo esto en firefox

http://img857.imageshack.us/img857/4255/dibujoprs.jpg

que es lo que quiere entonces?

[ArturoGallegos]

si pero tienes la ventana maximizada, agrega mas contenido para que supere el alto o cambia el tamaño de tu navegador y veras a lo que me refiero

[memoadian]

ah ya lo del scroll. no pensé que fuera tanto problema.

y no lei tu mensaje del min-height, no se por que me lo salté.