How to center div vertically inside of absolutely positioned parent div

Question

I am trying to get blue container in the middle of pink one, however seems vertical-align: middle; doesn\'t do the job in that case.

Answer 1

For only vertical center

    

        
test
    

I always do like this, it's a very short and easy code to center both horizontally and vertically

.center{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

Hello Centered World!