css - 在具有固定位置的元素上隐藏溢出

Question

有没有办法用容器隐藏固定div 的溢出？我认为 fixed inside fixed 会做到这一点，但似乎并非如此。我能想到的唯一解决方法是“反转”掩码：其他固定的 div 隐藏了它周围的所有内容，但如果有任何其他解决方案会更好。

这是小提琴：http: //jsfiddle.net/pjFa6/1/

Answer 1

不幸的是，似乎不可能将一个固定元素嵌套在另一个元素中（无论是否固定），并期望外部元素将其包裹并隐藏任何溢出。

我唯一能想到的是将内部 div 设置为position:absolute而不是固定。这是基于您的 jsfiddle 的示例：jsfiddle.net/pjFa6/15。

Answer 2

在某些移动浏览器上下文中，使用-webkit-overflow-scrolling: touch可以实现“裁剪”的固定位置元素。见：https ://miketaylr.com/posts/2015/06/position-fixed-overflow-hidden.html

Answer 3

withz-index: any value;容器中的声明将在某些 webkit 浏览器中执行，例如 chrome。