css – 引导下拉列表:定位下拉内容

前端之家收集整理的这篇文章主要介绍了css – 引导下拉列表:定位下拉内容前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有以下下拉列表
<label class="dropdown-toggle" role="button" data-toggle="dropdown" data-target="#">
    Action <b class="caret"></b></label>
<ul class="dropdown-menu" role="menu" aria-labelledby="lang-selector" id="lang-selector">
    dropdown content goes here
</ul>

下拉列表的左上角位于文本(Action)的左下角,但我希望dropdwon的右上角的位置位于文本的右下角位置。我怎样才能做到这一点?

感谢致敬。

解决方法

编辑:

As of v3.1.0,we’ve deprecated .pull-right on dropdown menus. To
right-align a menu,use .dropdown-menu-right. Right-aligned nav
components in the navbar use a mixin version of this class to
automatically align the menu. To override it,use .dropdown-menu-left.

您可以使用“下拉右侧”类在光标右侧排列插入符号:

<li class="dropdown">
  <a class="dropdown-toggle" href="#">Link</a>
  <ul class="dropdown-menu dropdown-menu-right">
     <li>...</li>
  </ul>
</li>

工作在这里:http://jsfiddle.net/jaq54yw8/

我离开了我以前的答案下面只是为了防止任何人使用Bootstrap< 3.1.0但你一般应该使用上面的(如果它似乎没有工作双检查你包括的Bootstrap的版本号)! 您可以使用“右 – 右”类在光标右侧排列光标:

<li class="dropdown">
  <a class="dropdown-toggle" href="#">Link</a>
  <ul class="dropdown-menu pull-right">
     <li>...</li>
  </ul>
</li>

猜你在找的CSS相关文章