Javascript 使绝对链接的容器可变并且不拉伸视口的整个高度？

我有一个固定的标题和下拉菜单。然后，菜单具有从右侧滑入的子/孙链接。我面临的问题是，如果children/孙子节比原来的顶级节长，那么这些额外的链接就会被切断。例如，在我的“服务”演示中，即使我有6个孩子，您也只能看到1-4个孩子是否有办法在不使导航ul为100vh的情况下解决此问题？我希望容器的高度仅为其需要的高度，以便根据当时可见的链接数量进行拉伸/收缩

因为我必须添加溢出：隐藏，我必须隐藏滚动条。我不希望用户在菜单内滚动。我希望菜单显示所有的子链接，没有任何滚动

指向代码笔的链接：（在代码笔中，我将nav ul设置为

height:100vh

，这样链接就被切断了，但我不希望此容器拉伸视口的高度

我还将代码粘贴在下面

我的守则如下：

*{
框大小：边框框；
}
身体{
字体系列：arial，无衬线；
}
标题。固定{
宽度：100%；
高度：70像素；
位置：固定；
背景：#ccc；
}
.节选项卡{
位置：绝对位置；
宽度：298px；
背景#3E7D99；
左边距：70像素；
}
.扩大{
光标：指针；
}
.tab内部{
显示：无；
}
a{
文字装饰：无；
}
.父类别{
填充：9px 15px；
字体大小：粗体；
颜色：白色；
}
钮扣{
位置：相对位置；
宽度：100%；
身高：100%；
背景：#A89968；
边界：0；
高度：70像素；
}
保险商实验室{
列表样式类型：无；
填充：0；
颜色：白色；
位置：相对位置；
高度：自动；
溢出x：隐藏；
-ms溢出样式：无；
/*IE和Edge*/
滚动条宽度：无；
}
a{
颜色：白色；
}
李{
填充：9px 15px；
.下一个{
位置：绝对位置；
右：10px；
光标：指针；
}
}
ul{
转化：translateX（298px）；
位置：绝对位置；
排名：0；
左：0；
转型：转型0.4s轻松；
宽度：298px；
背面可见性：隐藏；
背景#3E7D99；
.回来{
位置：绝对位置；
左：15px；
光标：指针；
}
}
.有孩子。活动>ul{
变换：平移（0,0）；
身高：100%；
z指数：9；
}
.有孙辈。活动>ul{
变换：平移（0,0）；
身高：100%；
z指数：9；
}
ul-ul-li{
左侧填充：35px；
}
.回到原位{
变换：平移（0,0）；
}
.关门了{
可见性：隐藏；
}
.children>li：第一种类型，
.孙辈>李：第一类{
背景：#072258；
&：悬停{
背景：#072258；
}
}
.儿童李：悬停{
背景#336C86；
}

部分菜单（单击）


>


< 





>


< 


>


< 

看来你自己已经找到了一个解决方案，对吧？至少你的CSS代码读起来是

ul.nav{//height:100vh；}

。是的，我找到了一种方法，用JavaScript计算

的高度。这并不理想，但很有效。看来你自己已经找到了一个解决方案，对吧？至少你的CSS代码读起来是

ul.nav{//height:100vh；}

。是的，我找到了一种解决方法，使用JavaScript计算
的高度。虽然不理想，但它可以工作。