html - 相对 div 内绝对 div 的高度

Question

我在相对 div 中有一个绝对 div，我想让它具有固定尺寸。我的问题是高度被忽略了。

这是我的html结构：

<div id="wrap">
    <div>
        <h1>test</h1>
    </div>
    <div id="swipe">
        <br/>
    </div>
</div>

这是我的CSS：

body {
    background-color: #7ECEFD;

    margin: 0;
    padding: 0;
}

#wrap {
    width: 100%;
    margin: auto;
    overflow: hidden;
    position: relative;
}

#swipe {
    background-color: white;    
    position: absolute;
    top:0;
    left:10px;
    width:100%;
    height: 500px; 
}

为什么？我怎样才能用css解决它？任何其他技巧（jquery）？

http://jsfiddle.net/nkint/XQzJf/

Answer 1

它500px很高，但由于overflow: hiddenon ，大部分都被隐藏了#wrap。您需要删除它或使其足够大以包含#swipe.

Answer 2

html, body, #wrap {
   height: 100%;
}