前端css中li中，后面的把前面的给遮住了。如何解决？

如图，第一个li的选择框中，搜索行 被后面 两个已经选择好的内容遮住了。

添加z-index无限大，也没用啊。

奇怪的是：看div结构，第二层不会被遮住，只是第一层会出现这种情况。

其中，class="selectDiv" 的样式如下：有z-index
但是，我也给第一层加上z-index加上无限大，都没用啊。怎么搞啊？？？？

    margin-top: 0 !important;
    margin-left: 0 !important;
    width: 1000px;
    background-color: #dee8f9;
    box-shadow: 3px 3px 5px #888;
    padding: 5px 5px 10px;
    position: fixed;
    max-height: 300px;
    overflow-y: scroll;
    z-index: 16777271;

<div ng-show="SelectDivDispalyFlag" style="z-index: 16777271;">

//第一层
        <div style="z-index: 16777271;background: #F5F5DC;margin-top:10px;padding:5px;width:800px;">搜索:<input type="text" ng-model="filter.name_like" ng-change="flushData()" style="padding:3px;width:350px;"/>
            <a class="am-close am-close-alt am-close-spin am-margin-bottom-xs am-fr" ng-click="hiedecloseselectdiv()">&times;</a>
        </div>

//第二层
    <div class="selectDiv" style="width:800px;background:#F5F5DC;margin-top:0px !important;">
        


        
    </div>
</div>

---

z-index用法错误，z-idnex仅能应用在定位元素中，你第一层明显只设置了z-index没有定位