Z-index按钮不可点击

Question

我越来越讨厌一个小问题。当我修改我的按钮的z-index css属性（在滚动时它们重叠在我的顶部导航栏和页脚上）时，它们不是可点击是的，就像按钮上有东西。我怎么解决这个问题？

这是我的按钮：

<button class="btn waves-effect waves-light"><i class="small material-icons">add</i></button> 

这是CSS：

.waves-effect { 
position: relative; 
cursor: pointer; 
display: inline-block; 
overflow: hidden; 
-webkit-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
user-select: none; 
-webkit-tap-highlight-color: transparent; 
vertical-align: middle; 
z-index: 0; 
transition: .3s ease-out; 
} 
materialize3.css:5259 
.btn, .btn-large { 
text-decoration: none; 
color: #fff; 
background-color: #0091ea; 
text-align: center; 
letter-spacing: .5px; 
transition: .2s ease-out; 
cursor: pointer; 
margin-left: 5px; 
} 
materialize3.css:5241 
.btn, .btn-large, .btn-floating, .btn-large, .btn-flat { 
font-size: 1rem; 
outline: 0; 
} 
materialize3.css:5187 
.btn, .btn-large, .btn-flat { 
border: none; 
border-radius: 2px; 
display: inline-block; 
height: 36px; 
line-height: 36px; 
padding: 0 2rem; 
text-transform: uppercase; 
vertical-align: middle; 
-webkit-tap-highlight-color: transparent; 

Answer 1

你可能会想给负值的z指数，造成其他的div重叠按钮并使其不可点击。相反，尝试给导航栏和页脚一个正值（大于按钮的z-index值）。

没有足够的代码进行调试。用工作模型描述你的问题，你可能会解决你的问题。