Question

我的网站上有一个固定的标题，在标题内我有一个触发垂直类别菜单的按钮，如amazon.com。问题是菜单中的类别（或列表项）超过了标准视口的高度，如果一个人向下滚动以查看更多类别菜单div保持固定而页面上的其他内容滚动，我使用了溢出流程财产到我的菜单div但它没用。任何解决方案？

.ma-header-container {z-index: 9999;/*background: url(../images/yay-vo/bg.png) no-repeat 100% #fff;*/padding-bottom: 25px;background-size: 100% 100%;position: fixed;left: 0;right: 0;top: 0; }
.scr-ma-header-container {border-bottom: 1px solid #e7e7e7;height: 95px;z-index: 9999;background:#fff;/*padding-bottom: 25px;*/background-size: 100% 100%;position: fixed;left: 0;right: 0;top: 0; }

以上css是我的固定标头容器

.YV-allcat {
vertical-align: top;
font-family: Arial;
font-size: 15px;
color: #000;
height: 50px;
/*height: 40px;*/
width: 146px;
background-color: transparent;
border-top: 2px solid #c2c2c2;
border-bottom: 1px solid #c2c2c2;
border-left: 1px solid #c2c2c2;
border-right: 1px solid #c2c2c2;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
float: left;
background: none;
border-bottom-right-radius: 0px;
border-top-right-radius: 0px;
box-shadow: none;
/*background-image: url("../images/yay-vo/menu-arrow.png");
background-repeat: no-repeat;
background-position: 110px 33px;*/
}

这是触发菜单的按钮

.main-menu {
width: 180px;
/* margin-left: 14px; */
padding: 12px 0px;
float: left;
/* background: url(../images/left-menu-bg.png) top left repeat-y; */
position: absolute;
top: 174px;
/* top: 157px; */
/* border-right: 4px solid #565656; */
/* margin-top: 10px; */
background-color: #FFF;
z-index: 9999;
border: 1px solid #cecece;
/* min-height: 546px; */
min-height: 450px;
height: auto;
}

那就是超出类别数量的菜单，希望有所帮助

Answer 1

溢出属性不起作用，因为我没有给出最大高度，这两行挽救了我的生命

max-height:100%;
overflow-y:auto;

Scroller为固定父Div中的绝对div

1 个答案: