Twitter引导下拉菜单超出屏幕范围 [英] Twitter bootstrap dropdown goes outside the screen

问题描述

我要实现twitter bootstrap下拉菜单，这是我的代码：

I want to implement twitter bootstrap dropdown menu, here's my code:

<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>

Dropdown效果很好，我的下拉菜单放置在屏幕右边缘的旁边，当我单击下拉菜单时，列表将超出屏幕。它看起来像在屏幕上：

Dropdown works good, my dropdown is placed next to right edge of the screen and when I click my dropdown-toggle, the list goes outside the screen. It looks like on the screen:

我该如何解决？

推荐答案

添加。向右拖动到 ul.dropdown菜单应该这样做

弃用通知：从Bootstrap v3.1.0开始，下拉菜单中的 .pull-right 是已弃用。要右对齐菜单，请使用 .dropdown-menu-right 。

Deprecation Notice: As of Bootstrap v3.1.0, .pull-right on dropdown menus is deprecated. To right-align a menu, use .dropdown-menu-right.

这篇关于Twitter引导下拉菜单超出屏幕范围的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！