使父div高度与子高度问题相匹配

Question

尝试使父div高度与其包含child-div匹配。

<div id="parent">
    <div id="child">
        Content goes here
    </div>
</div>

继承人我的css：

#parent {
    width: 100%;
    overflow: auto;
    background-color: #f3efe7;
    z-index: 1;
    position:relative;
    top: 100px; // I have a header that is 100px in height and set to position: fixed.
}

    #child {
        max-width: 920px;
        position: relative;
        margin: 0 auto 0 auto;
        padding-top: 50px;
        padding-bottom: 40px;
        text-align: center;
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
        line-height:140%;
    }

子内容被裁剪并且未完全显示。我做错了什么？

亲切的问候约翰

Answer 1

编辑：发现它是我的页脚解决问题...因为它覆盖了ontop和部分重叠内容。该页脚CSS的问题在哪里？我无法理解是什么问题......

Here's the CSS for that:

#footer-top {
    width: 100%;
    height: 10px;
    background: #ffffff url('images/header/test4.svg') no-repeat; 
    z-index: 1;
    position: relative;
}

footer {
    width: 100%;
    background-color: #f3efe7;
    z-index: 2;
    position: relative;
    background-color: #ffffff;
}