如何在没有垂直滚动条的情况下设置100％的高度？
GeraltDieSocke
语境
我有一个固定高度的导航栏。我希望下面的空间可以垂直填充屏幕的其余部分。我还需要有一个固定的高度，因为我在页面内有一个容器，该容器的列表可以滚动但不滚动整个页面overflow: hidden
问题
当我在所有父元素上设置高度时，100%我得到一个垂直滚动条。我在SO上找到了一些有关“保证金崩溃”的答案，但没有什么可以解决我的问题。100vh没有滚动条也将无法工作。
这是用于设置高度的CSS（#__ next只是next.js呈现页面的div）：
html,
body,
#__next {
height: 100%;
width: 100%;
}
导航栏只是一个固定的像素高度，下面的空间有 height: 100%
这是显示垂直滚动条的屏幕截图：
我在Chrome检查器上找不到任何问题。
这是它的外观（设计文件）：
你知道如何解决吗？我需要同时具有屏幕“ SippetPanel”和“ SnippetContent”的两个容器，以在不添加滚动条的情况下获得剩余高度。隐藏内部溢出溢出的内部滚动条也应该起作用（稍后，当列表中有很多项（如设计文件中的内容）时）
其他
请注意，百分比高度是指父母的身高。您可以calc()用来解决问题：
#__next{
height: calc(100% - navbarpx);
...
}
对于填充问题，您可以查看border-box。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
如何在没有滚动条的情况下使第二个div填充屏幕的剩余高度？
- 2
如何在不添加滚动条的情况下设置 QScrollArea（在 QDialog 内）将扩展到的最大宽度？
- 3
如何在没有滚动条的情况下滚动Div？
- 4
如何在没有垂直滚动标题的情况下使DIV的浏览器高度达到100％
- 5
如何在没有垂直滚动标题的情况下使DIV的浏览器高度达到100％
- 6
如何在没有滚动条的情况下获取radChildwindow？
- 7
如何在没有滚动条的情况下以全屏方式打开批处理程序？
- 8
如何在没有滚动条的情况下创建水平可滑动菜单？
- 9
如何在没有git的情况下设置RapidJSON
- 10
没有滚动条尺寸的情况下如何获得内部窗口的高度？（不能通过clientHeight）
- 11
在没有滚动条的情况下获取div的高度
- 12
溢出-y：隐藏和溢出-x：隐藏，但是如何在没有滚动条的情况下向下滚动
- 13
如何在不使用jQuery的情况下创建简单的页面垂直滚动条？
- 14
如何在不显示垂直滚动条的情况下显示标题？
- 15
如何在我的情况下设置iframe内容高度？
- 16
如何在引导程序中以百分比形式设置div的高度而没有滚动条
- 17
主题：如何在没有用户干预的情况下自动移动滚动条
- 18
如何在没有水平滚动条的情况下隐藏<body>左侧的DOM元素？
- 19
为什么没有高度也没有很多信息的情况下仍显示滚动条
- 20
如何在没有滚动条的情况下向 flexbox 添加负边距（不显示，无法滚动，没有黑客）
- 21
如何在没有水平滚动的情况下将视频100宽度100高度容纳在引导程序中
- 22
如何获得Tkinter在没有滚动条的情况下显示非常大的图像？
- 23
如何在没有外部计时器的情况下设置QNetworkReply超时？
- 24
如何在没有〜运算符的情况下设置和清除位
- 25
如何在没有IDE的情况下设置Java工作区
- 26
如何在没有HSSFWorkbook实例的情况下设置单元格样式？
- 27
Stripe：如何在没有计划的情况下设置定期付款？
- 28
如何在没有设计的情况下设置act_as_votable？
- 29
如何在没有iconElementLeft的情况下设置应用栏组件？
我来说两句