html - Bootstrap 水平下拉菜单右对齐

标签 html css twitter-bootstrap

我在将水平下拉菜单与 row 容器的右侧对齐时遇到问题。这是因为我的 css 中有 position:fixed 但这是设置此类菜单样式的唯一方法。

这是我的CSS:

.top-main .dropdown-menu {
  width: 100%;
  position: fixed;
  top: 87px;
  z-index: 1000;
  text-align: right;
  padding: 5px 0;
  margin: 0 auto;
}

你可以在这里看到整个菜单:http://www.bootply.com/mNP0ficFef

如您所见,菜单与监视器的右侧对齐,但它应该与 的右侧对齐。有什么建议吗?

最佳答案

如果我正确理解您的要求,您所要做的就是在下拉列表中设置一个容器:

<ul class="dropdown-menu">
  <ul class="list-inline container">
    <li><a href="#" id="">Link 1.1</a></li>
    <li><a href="#" id="">Link 1.2</a></li>
    <li><a href="#" id="">Link 1.3</a></li>
    <li><a href="#" id="">Link 1.5</a></li>
  </ul>
</ul>

例子: http://www.bootply.com/Pu3P6c2nlO

关于html - Bootstrap 水平下拉菜单右对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24547476/

相关文章:

javascript - JQuery 悬停和 SlideToggle

javascript - 单击后 Angular 显示密码

javascript - 具有相似代码的页面 HTML CSS JS 之间的样式不同

html - 输入字段中的垂直对齐文本

html - 水平居中对齐带有伴随文本的 Bootstrap 按钮

javascript - 如何禁止点击除对话框以外的任何内容

html - 如何在此导航栏上赋予背景不透明度并水平对齐所有内容?

javascript - 单击时 CSS 滑动底部边框

javascript - 如何为较小的屏幕将自动滚动条垂直添加到 css bootstrap 附加菜单?

javascript - 使 Bootstrap Popover 可点击/SetTimeout 使用