css - 溢出：隐藏在某个位置：固定 div

Question

我在不同的 z 层上有两个 div。sidebar左侧的div（红色）和main右侧的 div。两者都嵌入了 2 个 div。

（红色背景色）sidebardiv 按预期在页面的 50% 处停止。但是，我没有隐藏[SHOULD NOT BE SEEN. BUT IS VISIBLE.]这个 div 的溢出。因此它覆盖了maindiv 的第二个内部 div [BLOCK RIGHT]。

这是两难境地，在白色背景的右侧看到。

http://jsfiddle.net/brazim/v6rk1b4q/39/

此布局的动机：使用 Javascript，用户将能够通过将 div的右侧边缘向左或向右拖动来显示 div 的完整内容sidebar或内容。mainsidebar

我可以处理 javascript，只是缺少正确的溢出。

感谢 JsFiddle 中的任何提示。

标签： csshtml

Answer 1

带有的元素与position: fixed其父容器无关，而是与视口相关，因此不受overflow设置的影响。您应该为此使用绝对定位，或者，如果您需要修复它（考虑到，在侧边栏的情况下，它已经由其父级修复）使用替代解决方案，例如display: none

参考：https ://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Positioning#Fixed_positioning