Centering an absolutely positioned element, No width/height

Centering an absolutely positioned element is still possible without knowing the width/height of the element. This an answer to: http://stackoverflow.com/questions/8508275/how-to-center-a-position-absolute-element

by Hashem Qolami

HTML

<div class="parent">
    <div class="child">
         I shall be in the middle of parentbox regardless of my size! Interesting, isn't it?
    </div>
</div>

CSS

.parent {
    background-color: gold;
    height: 400px;
    position: relative;
}

.child {
    position: absolute;
    top: 50%;
    left: 50%;
    
    padding: .8em 1.2em;
    color: white;
    background-color: darkcyan;
    
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}