Позиция абсолютного верхнего свойства на основе родительской ширины

Имея следующий HTML

<div class="child-of-body">
    This is a text
</div>

и следующий CSS

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

Я могу установить значение top для выбранных элементов. Я вижу, что 10% вычисляется на основе родительской высоты.

Как я могу установить свойство top в процентах на основе родительской ширины?

Я знаю, что это возможно с помощью JavaScript, но возможно ли это с помощью CSS?

JSFIDDLE

Ответы

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