使用插入 html 的 ajax 调用保持 div 的高度静态答案

【问题标题】：Keeping height of div static with an ajax call that inserts html使用插入 html 的 ajax 调用保持 div 的高度静态
【发布时间】：2012-07-06 04:03:08
【问题描述】：

我有一个 Ajax 调用，它插入一个带有多个 p 元素和文本的 div。问题是每当我单击按钮以获取 Ajax 时，整个容器的高度都会发生变化，因为我没有在我的 css 样式表中为容器设置静态高度（虽然我已经设置了特定宽度）。

每当我单击按钮加载 Ajax 信息时，都会有一个短暂的瞬间，您可以看到容器变得非常小，因为我只是将容器中的文本替换为其他文本。有没有一个简单的 css 解决方案？

【问题讨论】：

【解决方案1】：

您可以考虑使用 CSS min-height 属性，它可以防止容器缩小到太短的尺寸 (http://www.w3schools.com/cssref/pr_dim_min-height.asp)。例如，

#myContainer {
  min-height: 600px;
}

【讨论】：

【解决方案2】：

使用

min-height:400px;//Whatever height you want it to not get smaller than
height:400px;//Whatever height you want the div to be

这样它就不会变小并使用

overflow:auto;

这样当收到的内容多于预期时，它就不会变大，而是变成可滚动的。使用 overflow:auto 只会在内容溢出时显示滚动条。即，在需要时。

如果你想要滚动条，不管有什么用

overflow:scroll;//滚动条会默认出现，即使不需要。

【讨论】：