Hacer Pregunta

Conecta

entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

Condiciones para que la propiedad height tenga efecto con CSS

preguntó
Web
1102 Vistas
4 Respuestas
solucionada

Deseo que el DIV#vertical ocupe todo el espacio vertical de la ventana, aunque ya tiene height:100% no funciona ¿porqué?

<html>
    <head></head>
    <body>
        <div id='vertical' stlye='background:blue;height:100%'></div>
    </body>
</html>
por pregunton (20.400 puntos) en Web

4 Respuestas

1voto

Peter Puntos150480

Los contenedores ancestros del div deben tambien tener una altura declarada:

<html style='height: 50%;'>
    <body style='height: 50%;'>
por Peter (150.480 puntos)
seleccionada por

0voto

roel_magdaleno Puntos380

Si tienes un id dentro del div, ¿por qué no agregas el código CSS en un archivo .css? Ahora, la solución de tu problema sería un position:absolute; para eso tu estilo debería estar así:

body{
  height:100%;
  margin:0 auto;
}

#vertical{
  position:absolute;
  width:50px /*Aqui lo que gustes darle de ancho*/
  height:100%;
  background:blue;
}

Mira como se ve en este enlace: http://jsfiddle.net/8jTXN/

por roel_magdaleno (380 puntos)
editado por

1voto

nicolas_andreoli Puntos160

Te recomendaria que pongas en una hoja de estilo, y aparte tenes un error sintactico porque no cerraste con ; en height.

Por otro lado, si pones que tenga un alto de 100% y no pones nada adentro del div, tu div #vertical va a ser una linea.

por ejemplo proba esto:

<!---<div id='vertical' stlye='background:blue;height:100%;'></div>-->
<div id='vertical' stlye='background:blue;height:100%',border:3px solid red;'></div>
<!--- ahora vas a ver que se te creo una linea de color rojo con 3x de ancho.-->

ahora proba haciendo esto:

<div id='vertical' stlye='background:blue;height:600px'></div>
<!--- vas a ver que se te completo con rellegno azul un ancho de 600px-->

Ahora si voas no le queres especificar un alto determinado proque queres que eso se vaya adaptando segun el contenido, tendrias que crearle otros divs adentro con un alto determinado para que ese div padre se vaya adaptando..

espero te sirva.. saludos!

por nicolas_andreoli (160 puntos)

1voto

Fitosis Puntos160

Lo más fácil es encerrar el div con altura 100% dentro de un div con position relative

.div-contenedor{
  width:300px;
  height: 300px;
 position:relative;
}
.div-contenido-absolute{
  width:300px;
  height: 100%;
  position:absolute;
}
por Fitosis (160 puntos)

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


Sin Respuesta

Preguntas relacionadas

Actividad Reciente

Ultimas Preguntas

Preguntas relacionadas

Usuarios Top

Todos los Usuarios Usuarios Nuevos

Etiquetas

Categorías

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Etiquetas

Categorías

Conecta