提问者:小点点

Twitter bootstrap下拉列表显示在屏幕之外


我想实现twitter引导下拉菜单,这里是我的代码:

<span class="dropdown"> 
<a href="#menu1" class="dropdown-toggle" data-toggle="dropdown" ><img class="left" src="/static/img/topmenu_preferences.png" /><b class="caret"></b></a>
<ul class="dropdown-menu">
  <li><a href="#">a</a></li>
  <li><a href="#">b</a></li>
  <li><a href="#">c</a></li>
  <li class="divider"></li>
  <li><a href="#">d</a></li>
</ul>

null

下拉列表工作良好,我的下拉列表被放置在屏幕的右边缘旁边,当我单击下拉列表切换时,列表就会出现在屏幕之外。屏幕上看起来是这样的:

我该怎么修好它?


共1个答案

匿名用户

.pull-right添加到ul.dropdown-menu中就可以了

不推荐使用通知:从Bootstrap V3.1.0开始,下拉菜单上的.pull-right是不推荐使用的。若要右对齐菜单,请使用.Dropdown-Menu-Right