CSS : center form in page horizontally and vertically

Question

How can i center the form called form_login horizontally and vertically in my page ?

Here is the HTML I\'m using right now:

Answer 1

if you use a negative translateX/Y width and height are not necessary and the style is really short

#form_login {
    left: 50%;
    top: 50%;
    position: absolute;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
}

Example on codepen: http://codepen.io/anon/pen/ntbFo

Support: http://caniuse.com/transforms3d