無法將下拉菜單放置在其他正文元素上方

正如您在下面看到的，下拉菜單未放置在其他正文元素（如計時器）上。我正在使用bootstrap作爲定時器的下拉和redcountdown js。無法將下拉菜單放置在其他正文元素上方

HTML：

<div class="col-md-6 m-t-15" style="border-left:1px solid #fff;"><center> 
    <h3 class="material-animate"> 
    <select class="selectpicker" data-live-search="true" data-width="200px" id="d_d" style="text-align:center"><option><center>Select</center></option></select> 
    Delegate Time</h3> 
    <div id="delegate_time" class="redCountdownDemo material-animate"></div> 
    <div class="row"> 
     <div class="col-md-3"><input type="text" class="ttime form-control material-animate" placeholder="DD" id="dtd"></div> 
     <div class="col-md-3"><input type="text" class="ttime form-control material-animate" placeholder="HH" id="dth"></div> 
     <div class="col-md-3"><input type="text" class="ttime form-control material-animate" placeholder="MM" id="dtm"></div> 
     <div class="col-md-3"><input type="text" class="ttime form-control material-animate" placeholder="SS" id="dts"></div> 
    </div><br> 
    <span class="btn btn-success material-animate" id="d_update"><i class="fa fa-clock-o"></i> Update</span> 
    <span class="btn btn-danger material-animate" id="d_reset"><i class="fa fa-refresh"></i> Reset</span> 
    <div class="checkboxer form-inline"> 
     <input type="checkbox" value="" id="mspeak"> 
     <label for="mspeak">MSpeak</label> 
    </div> 
</center></div>

我試圖解決位置與所有元素的z索引，但沒有發生在工作。所以我已將所有CSS修改重置爲初始狀態。

請幫助我將下拉菜單放在身體其他所有元素的上方。

有關完整代碼，請訪問：https://github.com/lightofindia1/DiPSMUN-Moderator-App

來源

2017-07-01 Manikiran

我會說它必須是z-index和positon：相對的，元素的絕對值。也許下拉是一個div的孩子，它具有較低的z-指數，然後div與圖表？ – Wordica

您需要提供可重現問題的工作代碼片段，但沒有人有興趣解析您的所有代碼 – LGSon

另外，'

'標籤已被棄用，因爲...... looooong前... – LGSon

這兩種風格添加到您的CSS文件（的elements.css也許底部）或地方要覆蓋以前的：

.display-animation .material-animate { 
    z-index: 1; 
    position: relative; 
} 

.display-animation h3.material-animate { 
    z-index: 2 !important; 
}

您將實現你想要什麼！

來源

2017-07-01 21:21:10 Afshin

非常感謝，這真的有效！ – Manikiran

無法將下拉菜單放置在其他正文元素上方

回答

相關問題