Html 导航不为'；t与父Div垂直对齐

如本截图所示

。。。我在红色导航栏上有一个图标，它没有垂直居中于它的父项

div

（灰色栏）。我已经尝试过溢出：隐藏，但这只会隐藏问题

HTML: 试试这个

---

我已将您的代码粘贴到JSFIDLE并添加了一些：

body {
    margin: 0;
} 
.menu {
    position: absolute;
    min-height: 0%; /*RESET*/
    bottom: 0;
    width: 100%;
    height: 70px;
    background: #3e3e3e;
    z-index: 9999;
    text-align: center;
}
nav {
    display: inline-block;
    height:100%;
    width: 700px;
    margin: 0 auto;
    background-color:#F00;
}
nav ul {
    padding-bottom:20px;
    line-height:0;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
nav ul li {
    float: left;
    margin: 0 20px 0 0;
}
nav ul li a {
    display: block;
    width: 50;
    height: 50px;
    background-color:#006;
}

---

您的

导航ul

需要

显示：内联块--看一看：
只需添加
边距：0至
导航ul
这也可能是线路高度问题。重置您的li和ul:
行高：1em这将导致水平居中消失。右，已编辑。将“文本对齐：居中”添加到。菜单将恢复水平对齐。不幸的是，这将导致水平居中消失。我们实际上需要做的就是添加
margin:0添加到
ul
@AndyM是正确的，您还可以将padding:0添加到ul。我已经更新了我的jsfiddle，这将导致红色栏中的菜单项垂直改变。为了在不影响其他事情的情况下解决问题，我们只需将
ul
设置为
margin:0
.menu {
    position: absolute;
    min-height: 0%; /*RESET*/
    bottom: 0;
    width: 100%;
    height: 70px;
    background: #3e3e3e;
    z-index: 9999;

}
nav {
    height:100%;
    width: 700px;
    margin: 0 auto;
    background-color:#F00;
}
nav ul {
    padding-bottom:20px;
    line-height:0;
    list-style: none;
    position: relative;
}
nav ul li {
    float: left;
    margin: 0 20px 0 0;
}
nav ul li a {
    display: block;
    width: 50;
    height: 50px;
    background-color:#006;
}

.menu {
    text-align: center;
}

nav {
    display: inline-block;
}

body {
    margin: 0;
} 
.menu {
    position: absolute;
    min-height: 0%; /*RESET*/
    bottom: 0;
    width: 100%;
    height: 70px;
    background: #3e3e3e;
    z-index: 9999;
    text-align: center;
}
nav {
    display: inline-block;
    height:100%;
    width: 700px;
    margin: 0 auto;
    background-color:#F00;
}
nav ul {
    padding-bottom:20px;
    line-height:0;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
nav ul li {
    float: left;
    margin: 0 20px 0 0;
}
nav ul li a {
    display: block;
    width: 50;
    height: 50px;
    background-color:#006;
}