jquery - 可调整菜单高度的 CSS

Question

我的网站有很长的导航菜单。请检查以下网址和导航菜单“技术组”->“技术 session ”和“业务组”->“业务 session ”。这些菜单太长了，我在页面后面出现了空白。我希望此菜单根据页面大小自动调整大小。我试过 css 但没有得到令人满意的结果。

http://prismeforum.org/new/top-content-for-prisme-members/meetings/2008-fall-daiichi-sankyo-usa/

查看以上页面以供引用。

 {
   Position: fixed;
   height: auto;
   overflow-y: scroll;
 }

我试过类似上面的 css。

Answer 1

在 float 在外面的子菜单中添加一个类(如menudiv)，然后添加css

.menudiv {
overflow-y:scroll;
overflow-x:hidden;
height:50%;
}

如果你想设置滚动条的样式，那么你可以使用

.menudiv::-webkit-scrollbar {
  width: 4px;
}

.menudiv::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
border-radius: 2px;
}

.menudiv::-webkit-scrollbar-thumb {
border-radius: 2px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}