我不知道是否有问题,但我想知道为什么overflow:hidden它不能在fixed父/子元素上起作用.

这是一个例子:

CSS和HTML:

.parent{
  position:fixed;
  overflow:hidden;
  width:300px;
  height:300px;
  background:#555;
}
.children{
  position:fixed;
  top:200px;
  left:200px;
  width:150px;
  height:150px;
  background:#333;
}

<div class="parent">
  <div class="children">
  </div>
</div>

现场演示:jsFiddle

我有一段时间没有这个问题,它似乎是一个尚未修复的Chrome重绘错误.所以我正在寻找任何止损修复.

主要问题是当页面上的元素具有使用以下内容的背景图像时:

background-attachment: fixed;

如果另一个元素被修复并且具有子视频元素,则会导致具有背景图像的元素消失.

现在它在Safari(以及Firefox和IE)中运行良好,因此它不是一个webkit问题.我已经应用了几个被认为无用的属性.

-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);

初始演示

目前,我的解决方案是通过媒体查询以固定的bg图像为目标,然后关闭固定的背景属性.

@media screen and (-webkit-min-device-pixel-ratio:0) {
background-attachment: scroll;
}

有任何想法吗？

更新

丹尼尔感谢工作演示.

更新2

更好的演示!

大喊答题节目环节以somesayinice和FourKitchens博客文章