css - 两边边距相同，看起来仍然不居中

Question

尝试将导航栏设置为居中，但我觉得它看起来更靠近左侧而不是右侧。

我给它一个宽度和剩下的一半作为左边距，但没有改变。我将元素的边距设置为 0，以防它可能会影响，并且与填充相同。有谁知道是否有我不指望的 margin 元素？谢谢

nav{
    display: block;
    width: 50%;
    padding: 0;
    margin-left: 25vw;
    margin-top: 5vh;
    margin: auto;
}

Answer 1

为此，我建议使用 flexbox 。你需要一个像这样的内部元素:

nav {
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #ededed;
}

.inner {
  background-color: #ccc;
  width: 50%;
  text-align: center;
}

<nav>
  <div class="inner">
    Hello world!
  </div>
</nav>