z-index下的div：-1不可点击

Question

您好我目前有一个页面上有多个图层我有这个内容容器，我已经设置在背面。在我的styles.css这里是我的代码

#content-container{
/**position**/
position: absolute;
top: 0px;
padding-top: 80px;
padding-left: 80px;
z-index: -1 !important;
/**size**/
width: 100%;
height: 100%;
}

此处还有account-container代码

#account-container {
/**position**/
float:right;
margin-top:2px;
margin-right:-60px;

/**size**/
width: 350px;
height: 220px;
border-radius: 5px;

/**color**/
color:black;
background-color: white;

}

我设置了这个，因为我有accounts-container这就是点击时应该是content-container截至目前这就是它的样子

你可以在右上角看到accounts-container，但是发生的事情是div content-container不再可点击了 任何想法？

Answer 1

如果您的“accounts-container”上面有任何“图层”（更高的z-index），则此容器（透明部分）必须将CSS属性pointer-events设置为none：

.whatever {
  pointer-events: none;
}

这样可以防止点击事件定位到叠加层。