下拉隐藏了。不透明度,溢出和z-index不起作用

时间:2017-01-20 07:27:50

标签: javascript html css drop-down-menu

enter image description here

下拉隐藏。我不知道是什么问题。如果我给不透明度和溢出可见它不起作用。我试过检查元素,但它不起作用。

文字框代码: -

<input class="typeahead form-control tt-input" id="search" placeholder="Location" type="text" spellcheck="false" dir="auto" aria-activedescendant="" aria-owns="search_listbox" role="combobox" aria-readonly="true" aria-autocomplete="list" style="position: relative; vertical-align: top;">

CSS: -

element.style {
    position: relative;
    vertical-align: top;
}
.form-control {
    padding: 10px 22px;
    border: 4px solid #938F94;
    height: 47px;
}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
}

tt-menu代码:-(下拉列表)

element.style {
    position: initial;
    top: 100%;
    left: 0px;
    z-index: 100;
    display: none;
}
.tt-menu {
    width: 350px;
    margin: 0;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

如何使溢出可见?

1 个答案:

答案 0 :(得分:0)

如果您使用的是bootstrap下拉列表,请使用此代码。

.dropdown{
   z-index:9999;
}