Html 水平对齐菜单文本

如果您看一下这个JSFIDLE代码： 我正在制作一个导航栏，但是文本没有水平对齐

#menu-list a {
    height: 40px;
    color: #fff;
    padding-top: 20px;
    display: block;
    text-decoration: none;
}

可能有很多指南/帮助，但不清楚他们使用了什么代码使其居中

我知道CSS中目前有代码将20px的填充放在文本上方，但如果我删除它，它将位于按钮顶部，这是我当前的临时解决方案

谢谢

编辑：这里是我所说的中心对齐的意思

---

查看“时尚配饰”是如何水平居中的

这里是更新的小提琴。我已经修改了

#菜单列表a

CSS，如下所示

#menu-list a {
    height: 60px;
    color: #fff;
    display: table-cell !important;
    text-decoration: none;
    vertical-align: middle;
    text-align: center;
    width:117px;
}

---

你的意思是垂直吗？他们使用文本对齐：居中；将其水平居中直线高度：？也许吧？@TreeTree不，我是说水平居中。@CharlieStaniforth但它已经水平居中了，即使在你发布的图像中也是如此。你的问题提出了一个垂直居中的问题。我在小提琴和你的形象中看到的唯一区别是“时尚配饰”。非常感谢，这正是我所需要的！