css - 菜单会将页脚推开

Question

我的下拉菜单有问题。当您将其悬停时，它会将页脚推开，并会产生一种怪异的效果，您可以滚动整个页面。（这只是当下拉菜单到达页脚时）我已经尝试了很多东西，比如 max-height 等，但它不会起作用。

网站：{固定}

如果您将鼠标悬停在“Zippo”菜单项上，那么奇怪的事情就会出现。

我怎样才能解决这个问题？

谢谢！沃特0100

Answer 1

您可以将下拉菜单位置设置为绝对：

#nav li ul {
   margin: 0px;
   padding: 0px;
   display: none;
   position: absolute;
   top: 25px;
   z-index: 99; /* edited */
}

Answer 2

更改以下类：

#nav li ul {
margin: 0px;
padding: 0px;
display: none;
}

到

#nav li ul {
    display: none;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 24px;
    z-index: 100;
}

Answer 3

由于菜单导航高度的高度，页脚下拉

要解决这个问题，您需要通过定位将菜单从正常 Dom 中拉出

#menu {position: relative;}
#nav {z-index: 100;position: absolute; }