程序更改内部html后Div未正确溢出

我正试图设计一个网站，你可以从搜索栏中搜索音乐，我希望在用户键入时显示建议，所以我使用javascript编程填充一个包含结果的div，但是它溢出了窗口，而没有使主体或div本身可滚动，即使它设置为自动

正如您可以进一步看到的，子div的高度约为2000px，远高于父div。我了解到，如果根元素设置为100%，则可以使用%heights，这似乎是因为它适用于父元素（如果我将其去掉，父元素也将是2000px）。我不明白的是为什么它对儿童组不起作用

为了可读性，我去掉了一些元素，但如果错误不在这里，我可以添加它们

CSS HTML

截图

---

要使div在另一个

溢出：隐藏的
容器中可滚动，您需要为其父容器定义
高度。例如，您可以将
#结果
包装到另一个div中：

#wrapper {
  height: 200px;
}
#results { 
  height: 100%;
  overflow-y: auto; /* just vertical scrolling if needed */
}

还有一些基本的html

<div id="wrapper">
  <div id="results">
   <!-- your content -->
  </div>
</div>



否则#results div将根据需要展开，因此不需要滚动，而用户无法看到视口之外的任何内容，因为滚动是被禁止的

你试过body{overflow-x:hidden}吗？我刚试过，没用。你能在jsfiddle的帮助下提供一个有效的演示吗？这样人们才能帮助你better@Hadron我虽然不能重现你的问题。如果有帮助，您可以使用
overflow-y:auto
或
overflow-x:auto
将
overflow:auto
限制为仅一个方向！
#wrapper {
  height: 200px;
}
#results { 
  height: 100%;
  overflow-y: auto; /* just vertical scrolling if needed */
}

<div id="wrapper">
  <div id="results">
   <!-- your content -->
  </div>
</div>