css - 在没有绝对定位或javascript的情况下将子div扩展到父div

Question

我该怎么做呢？

我的困境是我可以将我的子元素扩展到父 div 的高度没问题，但有时我的子元素比内容区域大并被切断。

查看以下标记和 CSS:

标记

<div class="parent">
    <div class="child">hello<br /><br /><br /><br /><br /><br /><br />there<br /><br />  </div>
</div>

CSS

.parent
{
    width: 100px;
    height: 100px;
    overflow: auto;
    background: pink;
}

.child
{
    background: orange;
    height: 100%;
}

This fiddle显示问题:子 div 未获得父 div 的 100% 高度 -(如您在上面的 fiddle 中所见 - 可滚动区域为粉红色)

Answer 1

div.child { height:100%; overflow-y:scroll; }