如何居中导航栏'；使用CSS的文本？

我想将我找到并编辑的导航栏添加到我的网站，但由于某些原因，我无法使文本在中心对齐

我尝试过使用文本对齐：居中；但它似乎不起作用。第27行是我尝试对齐文本的地方

我想做的是让整个导航栏横跨整个屏幕，而链接在导航栏的中心。就这样

JSIDLE链接：

正文{
填充顶部：30px；
}
/*菜单启动CSS*/
#lostnavmenu{
填充：0；
保证金：0；
边界：0；
宽度：自动；
}
#Lostnavul，
#Lostnavli{
列表样式：无；
保证金：0；
填充：0；
}
#Lostnavul菜单{
位置：相对位置；
z指数：597；
文本对齐：居中；
}
#Lostnavul li{
浮动：左；
最小高度：1px；
垂直对齐：中间对齐；
}
#Lostnavul li.悬停，
#LostNavul li菜单：悬停{
位置：相对位置；
z指数：599；
游标：默认值；
}
#Lostnavul{
位置：绝对位置；
最高：100%；
左：0；
z指数：598；
宽度：100%；
}
#Lostnavul li菜单{
浮动：无；
}
#Lostnavul菜单{
排名：0；
左：190px；
宽度：190px；
}
#lostnavmenu ul li:悬停>ul{
能见度：可见；
}
#Lostnavul{
底部：0；
左：0；
}
#Lostnavul{
边际上限：0；
}
#Lostnavul li菜单{
字体大小：正常；
}
#LostnavA菜单{
显示：块；
线高：1米；
文字装饰：无；
}
/*自定义CSS样式*/
#lostnavmenu{
背景:#333333；
边框底部：4px实心#F3B016；
字体系列：'Oxygen Mono'，Tahoma，Arial，无衬线；
字体大小：12px；
}
#lostnavmenu>ul{
*显示：内联块；
}
#lostnavmenu：之后，
#lostnavul：之后{
内容：''；
显示：块；
明确：两者皆有；
}
#Lostnavul菜单{
文本转换：大写；
}
#Lostnavul{
边框顶部：4px实心#F3B016；
文本转换：无；
最小宽度：190px；
}
#Lostnavul a{
背景：#1b9bff；
颜色：#ffffff；
边框：1px实心#0082e7；
边界顶部：0无；
线高：150%；
填充：16px 20px；
字体大小：12px；
}
#Lostnavul菜单{
边界顶部：0无；
}
#Lostnavul li菜单{
位置：相对位置；
}
#LostNavul li：第一个孩子>a{
边框顶部：1px实心#0082e7；
}
#lostnavmenu ul li:悬停>a{
背景：#4eb1ff；
颜色：#ffffff；
}
#LostnAvul li菜单：最后一个孩子>a{
-moz边界半径：0 0 3px 3px；
-webkit边界半径：0 0 3px 3px；
边界半径：0 0 3px 3px；
-moz背景剪辑：填充；
-webkit背景剪辑：填充框；
背景剪辑：填充框；
-莫兹盒阴影：0 1px 0#1b9bff；
-网络工具包盒阴影：0 1px 0#1b9bff；
盒影：0 1px 0#1b9bff；
}
#lostnavmenu ul li:最后一个子项：悬停>a{
-moz边界半径：0 3px；
-webkit边界半径：0 3px；
边界半径：0 3px；
-moz背景剪辑：填充；
-webkit背景剪辑：填充框；
背景剪辑：填充框；
}
#lostnavmenu ul li.has sub>a:after{
内容：“+”；
位置：绝对位置；
最高：50%；
右：15px；
利润上限：-8px；
}
#LostNavul li菜单：悬停>a，
#lostnavmenu ul li.active>a{
背景#F3B016；
颜色：#ffffff；
}
#lostnavmenu ul li.has sub>a:after{
内容：“+”；
左边距：5px；
}
#最后一次{
左：自动；
右：0；
}
#最后一次{
左：自动；
右：99.5%；
}
#LostnavA菜单{
背景:#333333；
颜色：#CBCB；
填充：0 20px；
}
#lostnavmenu>ul>li>a{
线高：48px；
字体大小：12px；
}
.fixedlostnavmenu{
位置：固定；
排名：0；
左：0；
右：0；
z指数：9999；
宽度：100%；
高度：自动；
背景色：#00a087；
保证金：0；
文本对齐：居中；
}
.fixedlostnavmenu li{
显示：内联；
}
.fixedlostnavmenu a{
显示：内联块；
}

测试。。。。

}

---

通过更新css来尝试：

#lostnavmenu ul {
  position: relative;
  z-index: 597;
  margin-left: 15%;
  margin-right: 10%;
}

---

我还将尝试添加@media标记，以便在下面的列表元素换行时进行修复。

在这里，这应该可以工作：

@导入url(http://fonts.googleapis.com/css?family=Oxygen+单声道）；
身体{
填充顶部：30px；
}
/*菜单启动CSS*/
#lostnavmenu{
填充：0；
保证金：0；
边界：0；
宽度：自动；
}
#Lostnavul，
#Lostnavli{
列表样式：无；
保证金：0；
填充：0；
}
#Lostnavul菜单{
位置：相对位置；
z指数：597；
文本对齐：居中；
}
#Lostnavul li{
浮动：左；
最小高度：1px；
垂直对齐：中间对齐；
}
#Lostnavul li.悬停，
#LostNavul li菜单：悬停{
位置：相对位置；
z指数：599；
游标：默认值；
}
#Lostnavul{
位置：绝对位置；
最高：100%；
左：0；
z指数：598；
宽度：100%；
}
#Lostnavul li菜单{
浮动：无；
}
#Lostnavul菜单{
排名：0；
左：190px；
宽度：190px；
}
#lostnavmenu ul li:悬停>ul{
能见度：可见；
}
#Lostnavul{
底部：0；
左：0；
}
#Lostnavul{
边际上限：0；
}
#Lostnavul li菜单{
字体大小：正常；
}
#LostnavA菜单{
显示：块；
文字装饰：无；
}
/*自定义CSS样式*/
#lostnavmenu{
背景:#333333；
边框底部：4px实心#F3B016；
字体系列：'Oxygen Mono'，Tahoma，Arial，无衬线；
字体大小：12px；
}
#lostnavmenu>ul{
*显示：内联块；
}
#lostnavmenu：之后，
#lostnavul：之后{
内容：''；
显示：块；
明确：两者皆有；
}
#Lostnavul菜单{
文本转换：大写；
}
#Lostnavul{
边框顶部：4px实心#F3B016；
文本转换：无；
最小宽度：190px；
}
#Lostnavul a{
背景：#1b9bff；
颜色：#ffffff；
边框：1px实心#0082e7；
边界顶部：0无；
线高：150%；
填充：16px 20px；
F
<header><div class="menu_center">
<nav class="fixedlostnavmenu" id='lostnavmenu'>

<ul>
   <li><a href='/home'><span>Home</span></a></li>
   <li><a href='/forum'><span>Forum</span></a></li>
   <li><a href='/vote'><span>Vote</span></a></li>
   <li><a href='/shop'><span>Store</span></a></li>
   <li><a href='/staff'><span>Staff</span></a></li>
   <li><a href='/getwhitelisted' target="_blank"><span>Get Whitelisted</span></a></li>
    </ul></div>
</nav>

#lostnavmenu ul {
  position: relative;
  z-index: 597;
  margin-left: 15%;
  margin-right: 10%;
}