我一直在想一些本来应该很容易的事情,但是在毫无结果的三个小时之后我还没有解决它:
有 friend 让我修复his WordPress website的模板以便水平导航菜单栏在页面上水平居中。他希望它紧贴红色部分的底部中间 - 然后它正好适合红色页面两侧的两个标志之间。
红色部分 (class="header"
) 将 text-align
设置为 center
。这似乎足以确保标题和其下方的描述文本居中对齐,但出于某种原因,我无法使菜单(ul
)与页面中心对齐。
有人愿意提出我做错了什么吗?为什么我无法让菜单居中?我需要在样式表中更改什么才能使其正常工作?
最佳答案
要使一行 block 居中,您应该使用 inline-block:
ul.menu { display: block; text-align:center; }
ul.menu li { display: inline-block; }
IE 不理解 inline-block,但如果你只为 IE 设置 inline,它仍然会像 inline-block 一样工作:
<!--[if lt IE 8]>
ul.menu li { display: inline }
<![endif]-->
关于css - 你能帮我用 CSS 将 <ul> 元素居中吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/544207/