我有一个问题,即div已经没有被剪切到父级overflow: hidden.

我在overflow: hidden这里查看了有关stackoverflow 的问题,但是大多数问题都存在问题,position或者似乎暗示我的代码应该正常工作.

这是一个MWE,你可以在这里找到jsfiddle:

<div id="parent">
  <div id="scroller">
    <div id="child">
      meh
    </div>
  </div>
</div>

CSS:

#parent {
  height: 500px;
  overflow: hidden;
}

#scroller {
  overflow: scroll;
}

#child {
  height: 10000px;
}

我所期待的

#parent也overflow: hidden因此#scroller被夹在父母的高度.因为它#child高于产生的高度overflow: scroll导致滚动条.

怎么了

#scroller只使用高度#child并忽略这两个overflow属性.

简单的解决方法呢？

• 在我的现实世界问题中有多个<div>s,#parent所以我无法给出#scroller高度.
• html是自动生成的,所以我不能删除#scroller.

谢谢你的帮助,Stefan

回答

在评论中实际上只有一个CSS答案display: flex …