为什么 `margin: 0 auto;` 不将我的无序列表居中？

为什么我不能使用 Margin: 0 Auto 将元素居中？

您正在尝试将标题中的无序列表居中div 使用边距：0 自动。然而，仅靠自动边距不足以居中。原因如下：

理解 Margin Auto

margin: 0 auto 将左右边距设置为 auto，导致元素水平居中。但是，这仅在显式定义元素宽度的情况下才有效。

在您的代码中：

#header ul {
  margin: 0 auto;
}

您已经定义了标题 div 的宽度，但是不是无序列表的宽度。因此，margin: 0 auto 对列表居中没有影响。

解决方案：

要使列表居中，需要明确定义其宽度：

#header ul {
  margin: 0 auto;
  width: 620px;  // or any desired width
}

其他注意事项：

如果您想要将元素（例如列表中的列表项）水平居中，定义宽度并使用 display: inline 或 float: left。但请注意，浮动元素的行为可能难以预测，因此通常建议使用内联。

例如，将列表项居中：

#header ul li {
  display: inline;
}

以上是为什么 `margin: 0 auto;` 不将我的无序列表居中？的详细内容。更多信息请关注PHP中文网其他相关文章！