在父级中包含子div而不在子级

Question

以下是我的查询的代码示例。

div.parent {
  background-color: #fff;
  border: 1px solid #AAA;
  width: 20em;
  height: 12em;
  overflow: hidden;
}
div.child {
  overflow: auto;
}

<div class="parent">
  <div class="buffer">
  </div>
  <div class="child">
    <span>Lorem ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim</span>
  </div>
</div>

描述

简要说明，父级已隐藏溢出，并且子级应该包含在父级中，但是当它到达末尾时，子级应该是可滚动的。 [编辑：我不希望将父级溢出 - 自动，因为在孩子上方可能会有一些内容，最好在用户滚动时不会隐藏]

到目前为止我所看到的

对此的大多数解决方案是预先设置孩子的身高，像这样（http://jsfiddle.net/ad9q216L/3/），我也看到了一些建议，即使用父亲的相对位置和绝对位置重新定位孩子。像这样的孩子（http://jsfiddle.net/ad9q216L/4/）。

我的问题

我的问题是，是否有任何替代解决方案，我不必设置子项的高度或位置，但当父项只有css隐藏溢出时，可以使子项可滚动？

Answer 1

我认为max-height：100％将完成这项工作

div.parent {
  background-color: #fff;
  border: 1px solid #AAA;
  width: 20em;
  height: 12em;
  overflow: hidden;
}
div.child {
  overflow: auto;
  max-height: 100%;
}

<div class="parent">
  <div class="buffer">
  </div>
  <div class="child">
    <span>Lorem ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim ipsum dolor sit amet, quot dicam sit eu, dignissim complectitur ne per. Et per dico fabellas, cum oratio torquatos definitionem id. Ludus omnesque complectitur mea no. Quot corrumpit patrioque in eos, nec et aeterno vidisse numquam. Ad tollit verear eam. Errem maiorum nusquam te qui, ex recusabo abhorreant vim</span>
  </div>
</div>