如何将内容块按下2像素

Question

我有一个<ul>块，其<li>列表构成子菜单。当您将鼠标悬停在主菜单栏（下面的页面链接）上时，绿色边框顶部条的高度为2像素，我无法弄清楚如何将其向下移动以完全覆盖页面主体部分顶部的蓝色条。

http://bit.ly/1IgmNKT

无论如何，建议非常感谢。感谢。

谨慎附加说明： 我已经尝试了很多样式来将块按下2像素，但是我试过的那些最终打破了子菜单悬停导航的流程，这导致子菜单在悬停时消失。

Answer 1

• 将clearfix添加到主菜单div #menu-main-menu:after { content: ''; clear: both; display: table; }

• 从顶部推送菜单项2px： #menu-main-menu > .menu-item { margin-top: 2px;}

• 去喝啤酒

Answer 2

如果我正确理解了您的问题，那么您正在谈论将子菜单向下移动2px。如果是这样，那么尝试遵循css代码

<强> CSS

.nav-menu {
    float:left;
    height:60px;
}

Answer 3

nav#site-navigation ul.sub-menu {
  margin-top: 2px;
  border-top: 10px solid #a4c74c;
  z-index: 1;
}

Answer 4

第一个和最后一个下拉列表

nav#site-navigation ul.sub-menu{z-index: 1;}

和中间一个：

 ul#menu-main-menu li.menu-item-has-children.pulldown-button ul.sub-menu{z-index:3;}

这就是你的菜单“消失”的原因。