Html 我怎样才能在中心找到这个菜单栏

我需要一些帮助，如何将导航栏放在中间？我尝试使用文本对齐标签，但似乎没有工作

正如你所看到的，导航栏更靠近左边距，我希望它位于中间

#菜单栏{
保证金：-0px；
填充：0px；
文本对齐：居中；
}
#菜单栏a{
文字装饰：无；
颜色：暗灰色；
文本转换：大写；
显示：块；
边际：0px；
填充：10px；
}
#梅努巴乌利酒店{
显示：内联块；
左边距：1px；
浮动：左；
字体系列：无衬线；
字体大小：大号；
背景色：白色；
}
身体{
背景：darkgrey；
}

您可以使用“显示”进行设置

#menubar {
    width: 100%;
    text-align: center;
}
#menubar-container {
    display: inline-block;
}

#菜单栏{
宽度：100%；
文本对齐：居中；
}
#菜单栏容器{
显示：内联块；
}
#梅努巴{
保证金：-0px；
填充：0px；
文本对齐：居中；
}
#菜单栏a{
文字装饰：无；
颜色：暗灰色；
文本转换：大写；
显示：块；
边际：0px；
填充：10px；
}
#梅努巴乌利酒店{
显示：内联块；
左边距：1px；
字体系列：无衬线；
字体大小：大号；
背景色：白色；
}
身体{
背景：darkgrey；
}

如果要使用文本对齐：居中，请不要使用浮动

请参阅代码片段，它将起作用

#菜单栏{
保证金：-0px；
填充：0px；
文本对齐：居中；
}
#菜单栏a{
文字装饰：无；
颜色：暗灰色；
文本转换：大写；
显示：内联块；
边际：0px；
填充：10px；
}
#梅努巴乌利酒店{
显示：内联块；
左边距：1px；
字体系列：无衬线；
字体大小：大号；
背景色：白色；
}
身体{
背景：darkgrey；
}

您可以为菜单添加固定宽度，并对其应用自动边距

margin:0自动

或者您可以使用来执行此操作

#menubar {
  display: flex;
  justify-content: center;
  margin: -0px;
  padding: 0px;
  text-align: center;
}

不过，对于flexbox规则，您需要一些

这里有一个
#菜单栏{
边际：0px；
填充：0px；
文本对齐：居中；
}
#菜单栏a{
文字装饰：无；
颜色：暗灰色；
文本转换：大写；
显示：块；
边际：0px；
填充：10px；
}
#美努巴保险公司{
显示器：flex；
左侧填充：0；
柔性包装：包装；
宽度：自动；
证明内容：中心；
}
#梅努巴乌利酒店{
显示：内联块；
左边距：1px；
浮动：左；
字体系列：无衬线；
字体大小：大号；
背景色：白色；
}
身体{
背景：darkgrey；
}









检查小提琴是否有用

CSS:

#menubar { 
  margin: -0px; 
  padding:0px; 
  text-align:center; 
  display: inline-block;
  width: 100%;
  margin: 0 auto;  
} 

#menubar a {
  text-decoration:none; 
  color:darkgrey;   
  text-transform:uppercase; 
  display:block; 
  margin:0px; 
  padding:10px;
}

#menubar ul li { 
  display: inline-block; 
  margin-left:1px;
  float:left;
  font-family:sans-serif;
  font-size:large;
  background-color:white;
}

#menubar-container {
  display: inline-block;
}

body {
  background: darkgrey; 
}

CSS部分：

#menubar {
display: inline-block;
text-align: center;
margin: -0px;
padding: 0px;
text-align: center;
}

#menubar a {
text-decoration: none;
color: darkgrey;
text-transform: uppercase;
display: block;
margin: 0px;
padding: 10px;
}

#menubar ul li {
display: inline-block;
margin-left: 1px;
float: left;
font-family: sans-serif;
font-size: large;
background-color: white;
}

body {
background: darkgrey;
}

HTML5部分：

 <div id="page">
 <div id="menubar">
 <div id="menubar-container">
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Chi siamo</a></li>
    <li><a href="#">Cosa facciamo</a></li>
    <li><a href="#">Tree-Climbing</a></li>
    <li><a href="#">Galleria</a></li>
    <li><a href="#">Contatti</a></li>
  </ul>
 </div>
 </div>
 </div>










现在它似乎有点靠近右侧，但在中间似乎不平衡！它就在中间。我想你可以检查一下左右的距离。