具有覆蓋的 Div 在 Chrome 中不滾動

Question

我的一個頁面上有一個可滾動的絕對 div，並且在它上面放置了一個透明的覆蓋層。 在下面創建了一個示例，

http://jsfiddle.net/mae8y2w4/1/

overflow-y: scroll; added

但內容不會在 Chrome 中滾動，在 Mozilla 中運行良好。 誰能告訴我可能是什么問題。

提前致謝，

內哈

Answer 1

刪除覆蓋 div 並使用：before

.box {
  width: 200px;
  height: 100px;
  overflow-y: scroll;
  position: relative;
}

.box::before {
content: '';
  position: fixed;
  width: inherit;
  height: inherit;
  background: rgba(0, 0, 0, .2);
}


  
  
 
   
 
    
.box {
  width: 200px;
  height: 100px;
  overflow-y: scroll;
  position: relative;
}

.box::before {
  content: '';
  position: fixed;
  width: inherit;
  height: inherit;
  background: rgba(0, 0, 0, .2);
}
 
    
<div class="box">
        <h2>A Long Message</h2>
        <p>This is a very long message and will be cut off. This is a very long message and will be cut off. </p>
        <p>This is a very long message and will be cut off. This is a very long message and will be cut off. </p>
</div> 
 
   
 
  

Answer 2

刪除最后一個<div> ： http://jsfiddle.net/mp0g5ab6/

Answer 3

從最后一個 div 中刪除 position：

<div style=" width:150px; height:55px;"></div>