Css 将两个ul段放置在同一水平线上

我在页面的左侧有一个带有下拉菜单项的

nav

部分（典型的UL/LI使用引导CSS）

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

如何做到这一点

---

这里有一个jsFiddle链接：

你可以把你发布的第二把小提琴放在上面，然后应用类似的基本知识：

注意，我在右侧列表周围添加了一个

div

，并将其移动到

nav

中，从而稍微改变了HTML

或者，您可以使用

display:flex

---

向我们展示您的代码和您尝试的内容代码很长。但我所做的就在导航部分（下拉菜单所在的位置）的下方我将以下内容和UL以及登录和注册项目放在一起。@Zeaklous很抱歉，我不知道如何在注释中添加代码。对于当前缺少代码的情况，我们唯一能提供的是一个非常通用的示例，说明了如何做。这是到JSFIDLE的链接：@Hidalgo您还需要什么吗？感谢您的帮助。我已经阅读了一系列关于display:inline block的在线文章，看看你是如何找到解决方案的。我还向cerain宽度添加了一个空样式，现在登录显示在更右边（如我所愿）。我仍然不明白为什么垂直线aligh:middle有效，但：top无效。但是没关系。它起作用了。

.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 */
}

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