父母身高基于相对定位的孩子

css是一件奇妙的事情，除非您被阻止并且没有 ahaha时刻。

css is a marvelous thing except when you are blocked and you haven't had your ahaha moment.

今天，我很难将包含相对位置元素的父div的缩放高度调整为适当的高度。这是因为孩子们正在使用 top 属性。

Today I am having trouble to scale the height of my parent div containing a relative positioned element to the proper height. This is because the children is using a top property.

现在我知道 top 适用于相对定位的元素，我理解为什么它不包含正确的高度值。

Now I know how top works on relative positioned element and I understand why it does not contains the proper height value.

我想知道的是：

是否可以在不更改填充或边距的情况下将此顶级属性包含在我父母的高度？

此处是我的代码的提琴手： http://cssdeck.com/labs/unfeydw0

或下面的简单代码：

Here is a fiddle of my code: http://cssdeck.com/labs/unfeydw0
Or a simple code below:

html：

<div>
    <div class="relative">
    </div>
</div>

css：

.relative {
    position: relative;
    top: 42px;
    height: 40px;
    width: 100%;
    background: red;
}

谢谢。