height: 100%;

Un cordial saludo estoy tratando de realizar un diseño con un div al 100%. Funciona bien, lo que pasa es que cuando ingreso información en este div y llega hasta el 100% en la parte inferior de la página aparece un espacio en blanco y el texto sigue avanzando pero el div se queda del mismo tamaño del largo del monitor, este div tiene color por lo que dicho espacio se ve muy feo.

el body y el html en teoría es lo más importante:

Código CSS :

body, html{
   height: 100%;
   margin: 0;
   min-height: 100%;
}
.contenedor{
   background-color: #ffc;
   margin: 0 auto 0 auto;
   padding: 0 1.82% 0 1.82%;
   position: relative;
   max-width: 1260px;
   width: 87.36%;
   height: 100%;
   min-height: 100%;
   -moz-box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.1);
   -webkit-box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.1);
    box-shadow:  10px 10px 10px 0px rgba(0, 0, 0, 0.1);
}

Proba sacando el height y dejando solo min-height.

Saludos!

Muchas gracias, me ha sido de gran ayuda, increíble por las cosas tan pequeñas con las que se puede estancar un proyecto jejej. gracias de nuevo.

De nada bro, me alegra haber sido de ayuda.

Saludos!