CSS：如何将水平列表居中？显示：内联不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11304186/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS: How can I center a horizontal list? Display:Inline not working
提问by Rob Vanders
I am having major trouble getting the simplest of codes to work. I want my css horizontal list to be centered, that's all.
我在使用最简单的代码时遇到了很大的麻烦。我希望我的 css 水平列表居中，仅此而已。
Link here: http://bit.ly/LtIBai
链接在这里：http: //bit.ly/LtIBai
I have this code:
我有这个代码：
#megaMenu.megaMenuHorizontal ul.megaMenu {
text-align: center;
}
#megaMenu.megaMenuHorizontal ul.megaMenu > li {
display: inline;
}
Yet it will not center?
然而它不会居中？
NOTE: The window must be at "tablet portrait" size to see the code I'm referring to. Approximately 800px wide, when the logo is centered and the menu falls to the next line, but before the mobile menu appears.
注意：窗口必须是“平板电脑纵向”大小才能看到我所指的代码。大约 800px 宽，当徽标居中且菜单落到下一行时，但在移动菜单出现之前。
回答by powerbuoy
The reason they refuse to center is because they are also floated to the left. Change dislay: inlineto display: inline-block; float: noneand they appear centered.
他们拒绝居中的原因是因为他们也向左浮动。更改dislay: inline为display: inline-block; float: none，它们会出现居中。
Edit: There's a lotof (mostly unnecessary) CSS code in there so you'll probably need to tweak a few other things before it looks right, but the floating is what's causing the non-centering at least.
编辑：那里有很多（大部分是不必要的）CSS 代码，所以你可能需要调整一些其他的东西才能看起来正确，但浮动至少是导致非居中的原因。
