Div后面的按钮应该被阻挡，但不知何故它仍在显示

Question

我有一个搜索框，通过AJAX调用填充下拉菜单。无论如何，持有搜索结果的DIV悬停在其他一些内容上。我遇到的问题是，作为DIV的一部分的取消按钮，假设是在搜索下拉框后面，由于某种原因没有被覆盖，我不能为我的生活确定原因..这里有什么建议吗？输出图像低于..

这是我的视图脚本，用于填充数据：

<li class="user-list-item">
<div class="search-list-item-container">
    <table>
        <tr>
            <td><?php echo $this->username; ?></td>
        </tr>
    </table>
</div>

CSS：

.button { 
display: inline-block;
float: left;
}
.button:hover {
background: #74D9EB;
color: #ffffff;
}
#display{
width:450px;
display:none;
float:left;
border-left:solid 1px #dedede;
border-right:solid 1px #dedede;
border-bottom:solid 1px #dedede;
overflow:hidden ;
position: absolute;
background: white;

-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/* -moz-box-shadow: 2px 2px 3px #666;
-webkit-box-shadow: 2px 2px 3px #666; */
 }
 .display_box{
padding:4px; 
/* border-top:solid 1px #dedede;  
border: 2px solid #000000;*/
font-size:12px;
max-height:350px;
overflow-y: scroll;
overflow-x: hidden;
opacity: 0.5;
 }

 .user-list-item{
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
 }
 .user-list-item:hover{
background:#3dcbe4;
color:#FFFFFF;

 }
 #shade{
background-color:#00CCFF;
 }

Answer 1

这看起来像是一个z索引问题。尝试添加

z-index: 9999;

到#display

Answer 2

你包含的html部分看起来不完整 - 而css引用的类和id不在html中 -

请相应更新参考资料 - 根据您的语法，它可能只是一个z索引问题 - 在您的代码更新之前不会确定。

z-index：9999被过度使用 - 当z-index：1和2会很好

Answer 3

这看起来像是一个z索引问题。尝试在下拉列表中添加z-index: 9999。