CSS阻止元素的高度大于父元素答案

【问题标题】：CSS stop element from having greater height than parentCSS阻止元素的高度大于父元素
【发布时间】：2010-11-07 10:44:46
【问题描述】：

我近似这个结构

<div> <div id='1'> </div> <div id='2'> </div> </div>

我想这样当 div 1 的内容变得太大而 div 2 无法放入主 div 时，它将获得一个滚动条并且不会将任何东西推离父 div 的底部。

如何在 CSS 中做到这一点？

编辑：

父 div（或者更确切地说，它的父 div）具有设定的高度。并且此时设置溢出：在 div1 上滚动只会使其超出底部并在侧面带有滚动条。

【问题讨论】：

我的印象是——记住我没有测试过这个理论——无论你在 div#1（和 div#2）中有多少内容，父 div 都会扩展以适应，除非你已经在那个父对象上定义了一个明确的宽度？
Div ID 不能以数字开头，因此您在测试时可能会遇到与解决方案的实用性无关的错误
是的，只是为了说明

【解决方案1】：

首先，您需要溢出：在 div 1 上滚动。您还需要以某种方式修复其高度值，以使 div 在达到该值后需要滚动条。如果您的父 div 有固定高度或最大高度，应该没问题。

编辑

看看这个：http://www.quirksmode.org/css/overflow.html。看来（不幸的是）您仍然需要为您的 div 1 的高度设置一个值。我想 max-height 也可以。而且，顺便说一下，要让滚动条只在必要时出现，你需要溢出：自动。

【讨论】：

【解决方案2】：

使用

overflow:scroll

在 div1 上的 CSS 中。

【讨论】：

【解决方案3】：

你可以使用溢出设置：

#id
{

   overflow: scroll;

}

【讨论】：