CSS无序列表对齐

我四处搜索，发现了很多关于这个问题的问题，但我尝试的答案似乎都不适用于我的情况。因此，我在导航标记内部有一个无序列表，我希望该列表相对于父导航标记居中。但不管我怎么做，列表总是偏右，从不在中间

HTML非常直截了当：

<nav>
<ul>
    <li>MENU</li>
    <li><a href="">Opt 1</a></li>
    <li><a href="">Opt 2</a></li>
    <li><a href="">Opt 3</a></li>
</ul>
</nav>

有什么办法可以让它工作吗？

试试这个

nav ul {
list-style-type: none;
padding: 0;
margin: 0;
}

---

这是因为

ul

有一个

padding

和

margin

应用于浏览器，默认情况下，您需要删除它们

nav{
浮动：左；
宽度：50%；
保证金：0；
填充：0；
背景：灰色；
文本对齐：居中；
}
导航ul{
列表样式类型：无；
颜色：蓝色；
保证金：0；
填充：0；
}

菜单

测试此项：

 <nav>
       <ul>
            <li>MENU</li>
            <li><a href="">Opt 1</a></li>
            <li><a href="">Opt 2</a></li>
            <li><a href="">Opt 3</a></li>
      </ul>
 </nav>

nav { 
   display:table;
   margin:0 auto;
   padding : 10px; 
}

菜单




导航{
显示：表格；
保证金：0自动；
填充：10px；
}

这完全奏效了！非常感谢！完全忘记了填充和边距…：我可以帮忙。请用正确答案回答：）

 <nav>
       <ul>
            <li>MENU</li>
            <li><a href="">Opt 1</a></li>
            <li><a href="">Opt 2</a></li>
            <li><a href="">Opt 3</a></li>
      </ul>
 </nav>

nav { 
   display:table;
   margin:0 auto;
   padding : 10px; 
}