1

El caso es que tengo este codigo

 ...
 <body>

   <div class="container">
    ...
   </div>

 </body>
 ...

Dentro del container tengo un formulario de login que ocupa mas o menos la mitad del height de la pantalla y yo con este codigo:

.container {
  background: gray;
  height: 100%;
}

Hago que el container me ocupa todo el height del navegador aunque los elementos no lo ocupen todo.

Hasta aqui todo bien, pero cuando paso a una pagina de registro esta es mas larga (tiene mas contenido, mas elementos) y ocupa mas del 100% del height del navegador y cuando bajo con el scroll el container (que esta de color gris) se queda hasta cierto punto y el "background: gray;" se queda hasta cierto punto. Osea que el color gris ocupa el 100% del height y cuando hay necesidad de scroll, de ahi para abajo no hay color gris. Espero darme a enterder.

2
  • Prueba a utilizar .container{min-height: 100vh;}
    – enxaneta
    Commented el 4 nov. 2018 a las 9:07
  • Eso es lo que estaba buscando. A investigar sobre esa propiedad, muchas gracias :) Commented el 4 nov. 2018 a las 13:04

1 respuesta 1

3

Hola amigo eso se debe a que el height 100% ocupa el 100% de la altura al cargar tu web al dar scroll eso se queda donde se cargo la web nada mas.

   <body> 
          <div class="container"> 
           ... 
          </div> 
     </body>

En el css agregas min-height para que a medida que des scroll el gris se mueva espero te sirva.

      .container { 
         background: gray; 
         min-height: 100vh; 
        }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.