Div al 100% de altura

[dBer]

Hola gente.

Quiero hacer una web personal, mediante scrollto hago que desde los links del menu baje o suba a la seccion correspondiente.

Me gustaria saber como puedo hacer que cada div ocupe el 100% de la altura del navegador, ya que hay algunos que no lo hacen y se ve el siguiente contenido.

Espero haberme explicado bien, si no, os intentare buscar algun ejemplo de alguna web que lo haga.

Gracias a todos.

[PHPeros]

Buena autorespuesta...

Código CSS:

div{
height: 100%;
}
 

Saludos

[dBer]

Iniciado por PHPeros

Buena autorespuesta...

Código CSS:

div{
height: 100%;
}
 

Saludos

Como que no funciona, si no, no hubiese hecho una pregunta que "parece" tan obvia.

La cosa es imaginate una web de 4 secciones a,b,c,d pues yo quiero que al pinchar en a o b o c o d al llegar con el scroll to a esa seccion se vea al 100% de altura, no ocupando lo que ocupe por contenido

[PHPeros]

No me lo voy a imaginar todo así que si haces el favor pon un poco de código.

[faillure]

no se necesita imaginacion, solo responder en base a la información ofrecida en la consulta

Código CSS:

width: 100vh;
 

[PHPeros]

Es prácticamente lo mismo que dar porcentaje.

[faillure]

eso, dicho como la ha dicho es falso en un 99.99999......9% de las veces

[PHPeros]

Si quieres que aumente en función de la ventana es mejor usar box-flex en css3. Te ahorrass un montón de bugs...

[pzin]

Lo habitual es crear un contenedor que mida el número de secciones por cien, y luego cada sección que mida cien entre el número de secciones.

Algo así:

Código HTML:

<div id="contenedor">
  <div class="seccion"></div>
  <div class="seccion"></div>
  <div class="seccion"></div>
  <div class="seccion"></div>
</div>
 

Código CSS:

html, body {
  height: 100%;
}
 
#contenedor {
  height: 400%;
}
 
.seccion {
  height: 25%;
}
 

[faillure]

Iniciado por PHPeros

Si quieres que aumente en función de la ventana es mejor usar box-flex en css3. Te ahorrass un montón de bugs...

¿estás trolleando o solo por sumar respuestas?

solo un apunte sobre el box-*: http://css-tricks.com/old-flexbox-and-new-flexbox/

pzin
creo que supones (das por hecho) demasiadas cosas

[dBer]

No discutais.

La idea exacta seria esta: http://diegoberges.com/

[PHPeros]

Hola, tengo la solución pese al palo que me han dado
Primero tienes que importar jquery y elegir los links clave que harán el efecto:

Código Javascript:

$('a[href=#id]').click(function (){ 
$('html, body').animate({
scrollTop: 400}, //Puedes cambiar el numero de pixls
'slow'); //desplazamiento lento
});
 

Es una animación sencilla.

Saludos

[pzin]

Iniciado por faillure

pzin
creo que supones (das por hecho) demasiadas cosas

Ehmm... Supongo que si.

PHPeros creo que esa parte ya la controlaba bien, es lo primero que dice en el mensaje.

[PHPeros]

PHPeros creo que esa parte ya la controlaba bien, es lo primero que dice en el mensaje.

Pues le has dado el code y no te ha dicho nada
Ese es el único super efecto que veo en la web, y no creo que sea suya

[dBer]

Iniciado por PHPeros

Pues le has dado el code y no te ha dicho nada
Ese es el único super efecto que veo en la web, y no creo que sea suya

Primero la web es mia, pero tube que utilizar el theme que veis pq me corria prisa y ahora la estoy haciendo yo completamente de 0 y por eso tenía esa duda.

Segundo, veo que presupones muchas cosas y no se pq siempre contestas de esas formas PHPeros, nadie imagino que conteste para llevarte la contraria, simplemente aportan lo que ellos creen.

Y 3º ese efecto de scrollTop creo que no es el correcto, primero pq no esta en ninguna parte del codigo y segundo pq seria una medida exacta lo que me has dado (no he probado a ponerlo con %) pero si te fijas la altura de la web varia desde un minimo hasta un maximo (que en mi pantalla de 24" no tiene fin)

Saludos y gracias a todos por la ayuda.

[PHPeros]

Todos contentos pues

[dBer]

Todos no, mi duda no ha sido resuelta.

[PHPeros]

Y que más necesitas? Lo del div ya ha sido contestado antes.

[dBer]

Iniciado por PHPeros

Y que más necesitas? Lo del div ya ha sido contestado antes.

Tu respuesta esta mal, asi que deja de escribir por escribir, si quieres ayudar vale, si no, deja de sumar mensajes, que no beneficias a nadie.

Voy a comprobar la de Pzin que no la vi ayer, como llenasteis el post de discusion... no lo vi.

[PHPeros]

Para la siguiente acuérdate que no se escribe tube ni saver.

Tampoco tenía pensado "beneficiarte".

[dBer]

Iniciado por PHPeros

Para la siguiente acuérdate que no se escribe tube ni saver.
No tenia pensado "beneficiarte".

Y a ti mas te valdria saber algo mas de programación, que ser tan listillo, que para lo que ayudas aqui, te podrías quedar en casa.

[faillure]

Iniciado por dBer

Voy a comprobar la de Pzin que no la vi ayer, como llenasteis el post de discusion... no lo vi.

se ve que no es el único que no viste, porque prefiero pensar que es esa la razón de tu indiferencia y silencio a la respuesta en mi primer comentario (5)

ah! en los post tambien se corrigen las respuestas erroneas, no solo las duda del que lo abre.

[dBer]

Iniciado por faillure

se ve que no es el único que no viste, porque prefiero pensar que es esa la razón de tu indiferencia y silencio a la respuesta en mi primer comentario (5)

ah! en los post tambien se corrigen las respuestas erroneas, no solo las duda del que lo abre.

Pues no la verdad que no, pq otra cosa no, pero siempre agradezco las respuestas que se me ofrecen.

Lo probare e indagare algo mas sobre ello.

Y yo no digo que solo haya que contestar mi duda, pero si que digo que no hay que desviarse tanto del tema como así ha sucedido.