html – Vertical alignment of elements in a div 

Now that flexbox support is increasing, this CSS applied to the containing element would vertically center the contained item:

.container {        
    display: flex;
    align-items: center;
}

 

Use the prefixed version if you also need to target Explorer 10, and old (< 4.4) Android browsers:

.container {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;

    align-items: center;
}