html - 仅在需要变大时更改巨型盒子的高度

Question

我想根据内容(取决于用户输入)使巨型盒子的高度变大。虽然这行得通，但我遇到了一个问题，即如果其中的内容不多，它也会缩小。巨型盒子在容器中。

如何让jumbobox只在需要时增长，不需要扩展时收缩到一定高度？我尝试设置 height 和 min-height 但没有成功。

CSS:

html
{
    height: 100%;
}

#body
{
    background-color: #FFFFFF;
    overflow-y: auto; 
    width: 100%;
    height: 100%;
}
#customcontainer3
{
    width: 100%;
    min-height: 100%;
    display: block;
    overflow: auto;
    margin-top: 2.5%;
    padding-left: 10%;
    padding-right: 10%;
}
#customjumbo4
{
    background-color: #EAEAEA;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0%;
    padding-bottom: 7.5%;
}

Answer 1

将我的 jumbo 改成这样:

#customjumbo4
{
    background-color: #EAEAEA;
    position: absolute;
    width: 80%;
    height: auto;
    min-height: 100%;
    overflow: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0%;
    padding-bottom: 7.5%;
}

现在它可以工作了，我花了一天的时间来弄清楚它:/