今天,我随时都会创建类似Combobox的。而且我不知道我无法显示所有可供选择的项目。
你可以看起来像:
似乎隐藏在桌子后面的ComboBox中的所有项目。
HTML code:
<div class="btn-group open">
<button type="button" class="multiselect dropdown-toggle btn btn-white btn-primary"
data-toggle="dropdown" title="None selected" aria-expanded="true">None selected
<b class="fa fa-caret-down"></b>
</button>
<ul class="multiselect-container dropdown-menu">
<li><label class="checkbox">Checkbox</label></li>
<li><label class="checkbox">
<input type="checkbox" class="ace" value="0"><span class="lbl"></span> STT</label></a>
</li>
</ul>
</div>
CSS代码:
.btn-group {
position: relative;
display: inline-block;
vertical-align: middle;
}
.multiselect-container {
position: absolute;
list-style-type: none;
margin: 0;
padding: 0;
}
.multiselect-container>li {
padding: 0;
}
li {
display: list-item;
}
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
padding: 5px 0;
margin: 2px 0 0;
}
如何在我的情况下显示ComboBox的所有项目?感谢。
答案 0 :(得分:1)
检查相关元素的z-index属性。您想要出现在前面的元素应该具有比您想要的元素更大的z-index属性。