Is there any way to hide the overflow of a fixed div with a container? I thought fixed inside fixed would do it, but it seems it's not the case. The only workaround I can think of is "inverted" masks: other fixed divs hiding everything around the one, but it'd be better if there are any other solutions.
Here's the fiddle: http://jsfiddle.net/pjFa6/1/
Unfortunately it seems to be impossible to nest a fixed element within another element (fixed or not) and expect the outer element to wrap it and hide any overflow.
The only thing I can think of is setting the inner div to position:absolute instead of fixed. Here is an example based on your jsfiddle: jsfiddle.net/pjFa6/15 .
In some mobile browser contexts, use of -webkit-overflow-scrolling: touch may achieve a "clipped" fixed-position element. See: https://miketaylr.com/posts/2015/06/position-fixed-overflow-hidden.html
with a z-index: any value; statement in the container will do in some webkit browsers, like chrome.
来源：https://stackoverflow.com/questions/11927583/hide-overflow-on-elements-with-fixed-position