如果父母和孩子的身高相同，为什么会有垂直滚动条？

Question

我希望将我.sideBar和.contentHolder元素包含在中.displayContainer。问题在于.displayContainer呈现了不必要的垂直滚动条。水平滚动条可以，但是不需要垂直滚动条。我检查并发现.displayContainer和子元素具有相同的计算高度。那么，为什么会有垂直滚动条？谁能告诉我如何删除它？body, html {  margin: 0px;  padding: 0px;  border: 0px;  height: 100%;  width: 100%;}.displayContainer {  height: 100%;  width: 100%;  overflow: auto;  white-space: nowrap;}.sideBar {  background-color: green;  display: inline-block;  width: 20%;  height: 100%;}.contentHolder {  background-color: red;  display: inline-block;  width: 100%;  height: 100%;}<div class="displayContainer">  <div class="sideBar"></div>  <div class="contentHolder"></div></div>

Answer 1

我相信显示垂直滚动条的原因是因为有水平滚动条。由于水平侧边栏覆盖了每个div的某些底部，因此无法看到div高度的100％，因此它添加了垂直滚动条以让您查看所有内容。

如果最后20像素左右没有任何东西（老实说应该没有），那么Dhaval建议的解决方法（将溢出：隐藏；添加到CSS中）应该可以。

如果您确实希望完全看到内容，可以尝试使用绝对值或将100％更改为99％