html - 如何仅使用 CSS 将文本区域扩展到 100%

Question

我有一个 textarea 标签，其中包含我希望用户编辑的文本。 textarea 标签像这样包裹在一个 div 中:

div.container {
   width: 295px;
   max-height: 250px;
   overflow: auto;
   position: relative;
   border: 1px solid: #EEEEEE;
}
textarea {
   width: 270px;
   height: 100%;
   resize: none;
   overflow: hidden;
   border: none;
}

<div class="container">
   <textarea id="overview">
      blah blah....
   </textarea>
</div>

div 有一个固定的宽度，一个最大高度，当高度太大时显示滚动条。这一切都很好，但我怎样才能让 textarea 扩展到 100%？它目前只有两行高，并且当我在其中有很多文本时不会展开以显示所有文本。 Please see this fiddle to see what I'm talking about.

Answer 1

您的 div.container 需要明确指定高度。子内容不会扩展到 max-height，只是 height。

是这样的: http://jsfiddle.net/dpF7k/或者更简单地直接应用于文本区域而不是包装 div:http://jsfiddle.net/ujKCf/

唯一缺少的是，如果内容较少，它不会收缩到 250px 以下。