导航栏对齐顺风左右不相等

Question

这是导航栏的图片

​

下面是我的代码：

<nav class="Vdark-2 shadow-xl">
  <div class="container mx-28 ">
    <div class="relative flex items-center h-16 justify-between">
      <div class="Vwhite-text text-4xl ml-10 myfont text-left">The Name of my website</div>

      <div class="text-right">
        <span class="Vwhite-text text-xl myfont mx-10">Home</span>
        <span class="Vwhite-text text-xl myfont mx-10">________</span>
        <span class="Vwhite-text text-xl myfont ml-10">______</span>
      </div>
    </div>
  </div>
</nav>

对我来说，问题是，为什么这在两边是不平等的？

Answer 1

您的边距具有固定的值，因此您的容器不会自动居中

将<div class="container mx-28 ">更改为<div class="container mx-auto">

应该可以做到这一点