0

我在空闲时间创建一个所见即所得的编辑器。我决定我想使用下拉菜单让自己选择格式。问题是当我添加一个下拉菜单时,它不在按钮下方,而是在按钮容器的开头。

这是一张图片来说明我的意思。

在此处输入图像描述

第一个按钮看起来是活动的,因为文本左对齐......对不起,我试图找到一种方法来解决这个问题,但下拉菜单来自最后一个按钮。

我的问题是,有没有办法将 Twitter Bootstrap 下拉菜单与它应该打开的按钮对齐,或者至少使下拉菜单与按钮容器的宽度对齐。

4

2 回答 2

0

是的。您可以通过定位或提供类来添加规则,例如left: auto; right: 0;,这样:<ul>.right-menu

.right-menu, .dropdown-menu.right-menu {left: auto; right: 0;}

同样的工作演示将在jsFiddle中。

于 2013-02-12T18:29:56.970 回答
0

.pull-right在容器上使用.dropdown-menu它使其粘在容器的右侧并不是一件坏事。

从源代码中可以看出,这个类是为了做到这一点:

// Aligns the dropdown menu to right
&.pull-right {
  right: 0;
  left: auto;
}

如果你喜欢让它和容器一样大,你可以尝试将它应用到你的菜单中:

.dropdown-menu {
  min-width: 100%;
}

你应该保留.pull-right以防你有更大的菜单。

检查小提琴演示

于 2013-02-12T18:53:38.623 回答