Foros del Web » Creando para Internet » CSS »

alto de un div

Estas en el tema de alto de un div en el foro de CSS en Foros del Web. estimados. tengo dos divs. <div id=encabezado>encabezado</div> <div id=contenido>contenido</div> de que manera puedo lograr que div#contenido ocupe todo el resto del a pantalla? tanto en ancho ...
  #1 (permalink)  
Antiguo 24/03/2008, 19:19
Avatar de dieguicho  
Fecha de Ingreso: noviembre-2001
Ubicación: Buenos Aires
Mensajes: 1.190
Antigüedad: 16 años
Puntos: 1
alto de un div

estimados.
tengo dos divs.

<div id=encabezado>encabezado</div>
<div id=contenido>contenido</div>

de que manera puedo lograr que div#contenido ocupe todo el resto del a pantalla? tanto en ancho como en alto?
probe con min-height: 100%; pero no funciona porque hace un div de 100% pero como yo ya tenia el encabezado me lo suma y me genera scroll.
la idea es que el encabezao ocupe lo que ocupe y todo el resto sea contenido
gracias!!
__________________
On error no hago nada porque deje de fumar...
  #2 (permalink)  
Antiguo 24/03/2008, 20:25
Avatar de juaniquillo
Colaborador
 
Fecha de Ingreso: noviembre-2005
Ubicación: San Juan, Puerto Rico
Mensajes: 5.745
Antigüedad: 12 años
Puntos: 281
Re: alto de un div

En algún sitio leí que tienes que darle al elemento padre un alto definido para que un div acepte el height 100%. En el caso de un contenedor debes darle al body y al html 100% y cero padding y margin porque si no crecen más del 100%, aunque la verdad es que nunca lo he probado ni se si funciona bien en todos los navegadores.
__________________
Por fin.. tengo algo parecido a un blog
Y por lo visto ya estoy escribiendo...
  #3 (permalink)  
Antiguo 25/03/2008, 02:18
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: alto de un div

Lo puedes hacer haciendo el contenido del 100% y metiendo el encabezado dentro:

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>cien por cien</title>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
}
#contenido{
height: 100%;
background-color: #788DA2;
height: 100%;
}
#encabezado{
background-color: #f00;
height: 100px;
}
</style>
</head>
<body>
<div id="contenido">
<div id="encabezado">encabezado</div>
<p>contenido</p>
</div></body>
</html>
Mikel.
  #4 (permalink)  
Antiguo 29/03/2008, 14:15
Avatar de dieguicho  
Fecha de Ingreso: noviembre-2001
Ubicación: Buenos Aires
Mensajes: 1.190
Antigüedad: 16 años
Puntos: 1
Re: alto de un div

y si fuera este el caso?

<div id=encabezado>encabezado</div>
<div id=contenido>contenido</div>
<div id=pie>pie</div>

mandar el pie abajo el encabezado arriba y todo el resto que sea contenido :)
__________________
On error no hago nada porque deje de fumar...
  #5 (permalink)  
Antiguo 29/03/2008, 15:35
Avatar de webosiris
Moderador egiptólogo
 
Fecha de Ingreso: febrero-2002
Ubicación: Luxor, Egipto
Mensajes: 10.727
Antigüedad: 15 años, 9 meses
Puntos: 997
Re: alto de un div

Cita:
Iniciado por juaniquillo Ver Mensaje
En algún sitio leí que tienes que darle al elemento padre un alto definido para que un div acepte el height 100%.
estás en lo correcto, y esto tiene su lógica.

el height X% significa que va a tener un alto de X% CON RESPECTO A SU ELEMENTO PADRE (el elemento HTML es padre de todos los demás, y por defecto tiene una altura = a lo que ocupen sus elementos hijos... en un sitio "vacio", esa altura es 0px)

Cita:
Iniciado por dieguicho
el pie abajo el encabezado arriba y todo el resto que sea contenido
para esa estructura lo que yo hago es meter el encabezado dentro del contenido, darle al contenido min-height:100% y posicionar el pie con margen negativo.... sería algo así
Código:
html, body{height:100%}
#contenido{min-height:100%;}
#pie{height:40px;margin-top:-40px}
Código HTML:
<div id="contenido">
<div id="top"></div>
</div>
<div id="pie"></div> 
__________________
Pasamos tus PSD a HTML

Pobre del que lo sabe todo, porque no tiene nada más que aprender ni razón para vivir. -
  #6 (permalink)  
Antiguo 31/03/2008, 14:57
Avatar de juaniquillo
Colaborador
 
Fecha de Ingreso: noviembre-2005
Ubicación: San Juan, Puerto Rico
Mensajes: 5.745
Antigüedad: 12 años
Puntos: 281
Re: alto de un div

Gracias webosiris. Yo había leído sobre eso pero la verdad es que nunca he tenido la necesidad de que hacer mis contenedores del ancho de body. siempre hago que el contenido defina la altura y, cuando tengo la necesidad de usar una imagen de fondo para todo, pongo la imagen en el body y la repito verticalmente.
__________________
Por fin.. tengo algo parecido a un blog
Y por lo visto ya estoy escribiendo...
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:37.