如何使容器div(给定高度)在调整其内部文本区域的大小时增加其高度

Question

这是我的代码。

div {
background: orange;
height: 200px;
padding: 10px;
}
textarea {
background: lightblue;
border: 5px solid blue;
width: 75%;
height: 50%;
resize: both;
}

<div>
<textarea>foo</textarea>
</div>

当调整textarea的大小以使其高度大于div的高度时，它会溢出到div之外。当调整textarea的大小以增加其高度时，是否有方法使容器div自动展开以包围较大的textarea？

Answer 1

将height更改为min-height基本上意味着，如果他有成长的理由——他会成长，但不会低于的价值

您可以对width属性执行同样的操作，或者将调整大小设置为垂直

div {
background: orange;
min-height: 200px;
padding: 10px;
}
textarea {
background: lightblue;
border: 5px solid blue;
width: 75%;
height: 50%;
resize: both;
}

<div>
<textarea>foo</textarea>
</div>