css - 我怎样才能创建一个扩展到一个高度然后显示滚动条的 DIV？

Question

我正在尝试实现一个 DIV，其中包含一些文本，并按以下方式运行:

• 固定宽度 (500px)

• 上限高度(最多 400 像素)

  1. 如果文本呈现为 <400px(例如，100px 高)，则包含的 DIV 与文本一样高(在我们的示例中为 100px)。

  2. 如果文本呈现为 >400px，则包含的 div 的高度仅为 400px，并且通过 DIV 中的垂直滚动条处理溢出。

我知道如何实现 #2 (overflow: auto; position: relative) 但这种行为取决于 height=400px 这当然否定了 #1 期望的行为.

这如何通过 CSS 实现？

我更喜欢一个合理的跨平台解决方案，如果这太难了，必须在 IE7、IE8 和 FireFox 10+ 上运行。

Answer 1

尝试组合 max-height和溢出:自动；。

Example .