javascript - 使用插入 html 的 ajax 调用保持 div 的高度静态

Question

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

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

Answer 1

利用

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;//默认情况下会出现滚动条，即使不需要。

Answer 2

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

#myContainer {
  min-height: 600px;
}