Position absolute top property based on the parent width

Question

Having the following HTML

    This is a text

and the following CSS

.child-of-         


        

Answer 1

try to add position: relative for the parent element.

Answer 2

I think you're looking for margin-top property.

A percentage value on top/bottom padding or margins is relative to the width of the containing block.

.child-of-body {
    position: absolute;
    margin-top: 10%;
}

JSFiddle Demo.

Also, it's worth to take a look at Louis Lazaris' Vertical Percentages in CSS article.