html - Wordpress 菜单 css 样式问题

Question

我已经开发了基本的 html&css 风格的菜单，我现在正试图将其更改为 wordpress 菜单。这里的问题来自高度波动。最小高度已设置为 50px，在 codepen 中它只会扩展到 55px 高度，在 wordpress 版本中它会扩展到 65px 高度。对此有任何样式帮助吗？ 55 像素的高度看起来还不错，但 65 像素太多了

#main-nav{
background: #2c2c2c;
margin: 0 auto;
min-height: 50px;
border-bottom: 5px solid #cd2122;
z-index: 12;
}
#main-nav ul li {
text-transform: uppercase;
font-family: arial,Georgia, serif;
font-size:12px;
position: relative;
display: inline-block;
float: left;
border:1px solid #222222;
border-width:0 0 0 1px;
height:50px;
}
#main-nav ul li a {
display: inline-block;
height: 50px;
line-height: 50px;
color: #ddd;
padding:0 14px;
text-shadow:0 1px 1px #000;
border-left:1px solid #383838;
position: relative;}

http://codepen.io/reshogun/pen/rOVmrz

Answer 1

您可以添加 55px 的 max-height 或删除 min-height 并为其指定 55px 的固定 height:

使用最大高度:Codepen

#main-nav{
background: #2c2c2c;
margin: 0 auto;
min-height: 50px;
max-height: 55px;
border-bottom: 5px solid #cd2122;
z-index: 12;
}

使用高度:Codepen

#main-nav{
background: #2c2c2c;
margin: 0 auto;
height: 55px;
border-bottom: 5px solid #cd2122;
z-index: 12;
}