html - 在 li 中卡住垂直文本对齐

Question

尝试将菜单文本放在正中间。到目前为止运气不好，事实证明这里的人非常有帮助。 :) 文本对齐中心通常可以帮助解决此处出现的大部分问题。虽然没有帮助我。我做错了什么？

<header>
<div id="navmenu">
<ul>
<li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
<li><a href="http://www.wordpress.org">Contact Us</a></li>
</ul>
</div>
</header>

#navmenu {
    margin-left:auto;
    margin-right:auto;
    height:60px;
    width:836px;
}
#navmenu ul {
    margin: 0; 
    padding: 0; 
    list-style-type: none; 
    list-style-image: none;
}
#navmenu li {
    display: inline-block;
    margin-left:1px;
    background-color:#3D3D3D;
    width:49%;
    height:40px;
    color:#FFF
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
}

Answer 1

如果文本总是在一行上，您可以通过使 line-height 与容器的高度相同来垂直对齐文本。

添加 line-height: 40px 到你的 li:

#navmenu li {
  ...
  line-height: 40px;
}