HTML
<div ng-controller="LangCtrl" class="dropdown dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="true" style="cursor:pointer;">
{{'COMMON.CHOOSE_LANG' | translate}}
<span class="caret"></span>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li ng-repeat="lang in langs" ng-click="changeLanguage(lang.key)" id="lang_{{lang.key}}"><a href="">{{lang.name}}</a></li>
</ul>
</div>
CSS
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 200;
display: none;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 12px;
text-align: left;
background-color: #ffffff;
border: 1px solid #cbcbcb;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
我尝试更改下拉菜单的z-index值,但没有解决问题。我不知道问题出在哪里。下拉列表中有四种语言,但有两种语言被隐藏。
我已经附上了CSS和HTML。请帮我。 任何帮助表示赞赏。
由于
答案 0 :(得分:1)
如果没有所有代码堆栈,我无法确定,但请您检查此问题是否由overflow: hidden
导致您的容器造成?
另请注意,只有定位元素会受到z-index堆栈的影响。