将两个ul截面放置在同一水平线上

Question

我有一个nav部分，页面左侧有下拉菜单项（典型的使用Bootstrap CSS的UL/LI）。

我想在登录和注册项目页面的右侧放置另一个UL/LI。我希望登录和注册项目与下拉菜单行顶部位于同一水平线上。

如何做到这一点？

这里有一个jsFiddle链接：http://jsfiddle.net/BaR3q/24/

Answer 1

你可以接受你发布的第二把小提琴，并应用我编辑你第一把小提琴的基础知识，如下所示：Demo

.nav-pills, .right-list  {
    display:inline-block;
    vertical-align:middle;
}
.right-list ul li {
    float:left; /* Needs a float for some reason, not sure why */
}

注意，我对HTML做了一些更改，在右侧列表周围添加了一个div，并将其移动到nav中，这就是它应该是的位置

或者，您可以使用display:flex此处演示

nav  {
    display:flex;
    justify-content: space-around;
    align-items: center;
}
.list-right {
    margin-top:10px;
}