CSS Alinear contenedor a la parte superior+inferior de la pantalla

Im trying to align the wrapper class to the top and bottom of the screen so when the user scrolls up/down the body background NEVER shows or leaves a gap.

The HTML and portions of the CSS are shown below;

CO

body{
    font: 14px/18px 'Nunito', sans-serif Arial, Tahoma, Verdana, sans-serif;  /* Normal text font */
    width: 100%;
    height: 100%;
    background:url('../img/bgs/bg-1.jpg'); /* Actual background */

    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center top;
    background-attachment: fixed;   
    margin:0px;         
}
#wrapper 
{
    width: 1000px;
    margin: 0 auto;
    min-height: 100%;
    height:100%;
    height: auto !important;
    background: white;

}

HTML

   <body>
            <div id="wrapper">

                    <header id="header">
                           more html + content
                    </header>

                    <div id="content">


                            <div class="default_page">

                                   more html + content

                            </div>

                    </div>
            </div>



    </body>

preguntado el 27 de noviembre de 13 a las 01:11

1 Respuestas

The space you see is a margin, collapsing to the body margin. To prevent this you can simply add overflow: hidden to both wrapper and footer, or set paddings (top and bottom respectively) to them.

respondido 27 nov., 13:02

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.