vertically center div when body height: 100% without absolute pos

Question

I have this to fill the window:

html, body {
height: 100%;}

then a container also set to height: 100%, how do I vertically center a div with an

Answer 1

You can use display:table and display:table-cell:

html, body {
    width: 100%;
    height: 100%;
}

body{
    margin: 0;
    display: table
}

body>div {
    display: table-cell; 
    text-align: center; /* horizontal */
    vertical-align: middle; /* vertical */
}

JSFiddle

More on display property .