Question

我使用position:fixed div与overflow: auto;作为透明div在某些弹出窗口的后面。

问题是，当我滚动查看此弹出窗口的底部或顶部时，会出现此重叠。

我怎么能继续使用这个div作为背景，能够滚动而不重叠？

a transparent bg, and the pop up in the front

HTML

 <div class="popup_screen_bg">
      <div class="popup_screen">
      <!-- update partner "form" -->
      </div>
  </div>

CSS

.popup_screen_bg{
  position: fixed;
  min-width: 100%;
  min-height: 100%;
  height: auto;
  z-index: 1000;
  overflow: auto;
  background: url('popup_transparent.png');
  padding-bottom: 20px;
}

.popup_screen{
  position: absolute;
  min-width: 80%;
  min-height: 80%;
  left: 10%;
  top: 10%;
  background-color: #EEE;
  border: 8px solid rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
   box-shadow: none;
}

注意：此问题仅出现在Chrome中。

Answer 1

This is my test image 。您可以看到它在谷歌浏览器中向下滚动，并且没有重叠。也许还有另一个原因？或者它可能只是一个小故障，因为你说它正在所有其他浏览器上工作。如果你也看右边有你的风格，你的div位于<body>内部的顶部。

在单个div中滚动会导致重叠

1 个答案: