我正在自定义 Bootstrap 3 中的菜单，但我不确定如何将下拉框相对于父级居中。
这是一张图片来解释我想要做什么 - http://i.picpar.com/MBw.png
这是一个 jsbin - http://jsbin.com/oCorUjA/1/
谢谢！
编辑：有人可以帮助我吗？我尝试了很多事情，但没有取得任何进展。
问问题
1022 次
2 回答
0
我有同样的问题，我所做的是给每个下拉菜单它自己的 ID，然后我会在 CSS 中定义元素，......你想要做的基本上是这样的：
首先不要覆盖核心引导 CSS ......但是在谷歌浏览器中，检查元素，当你找到下拉菜单时添加一个 margin-left: -35px; 并且您看到您的第一个下拉菜单将在中心排列，所以？...这应该让您了解每个具有自己 ID 的下拉菜单需要做什么:-) 您可能不想使用负边距，我只是让您知道该怎么做：
我个人为每个下拉列表提供了它自己的列 ID，并添加了正确的 CSS 以将其完全对齐在您想要的中心...希望这会有所帮助！
于 2013-10-24T20:07:56.153 回答
0
问题是您将下拉菜单的最小宽度设置为 160px（当您将鼠标悬停在其上时会切换的菜单）。它们设置为 float:left 并且始终为 160px 宽度，但上面的导航栏宽度基于您键入的单词的长度（服务器、托管服务等）。您可以通过将 (.dropdown-menu) css 位置更改为相对而不是绝对来解决此问题。这将导致导航栏在您将鼠标悬停在项目上时弹跳，除非您随后也将 (.navbar-nav li a) 设置为 min-width 160px。我建议使用 firefox 作为浏览器，这样您就可以检查元素、进行临时 css 更改以查看差异，并检查移动响应能力。祝你好运
于 2016-11-12T06:33:01.820 回答