使用 javascript 调整 textarea 的大小以适应流体宽度布局答案

【问题标题】：resize textarea to fit in a fluid width layout with javascript使用 javascript 调整 textarea 的大小以适应流体宽度布局
【发布时间】：2010-10-07 11:12:37
【问题描述】：

我有一个流畅的布局，我需要一个文本区域来根据父容器的大小进行扩展/缩小。

在 CSS 中它看起来像这样：

textarea{
width: 100%;
}

但这不适用于 textareas。

如何使用 javascript 做到这一点？我可以获取父元素的宽度，然后他们计算适合该宽度的列数，但我怎么知道 1 列的大小（以 px 为单位）？

【问题讨论】：

标签： javascript layout textarea resizable fluid

【解决方案1】：

检查一下：http://css-tricks.com/box-sizing/

  textarea {
            -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
            -moz-box-sizing: border-box;    /* Firefox, other Gecko */
             box-sizing: border-box;         /* Opera/IE 8+ */
           }

【讨论】：

这应该被标记为答案，这是完美的工作！

【解决方案2】：

现在是 2014 年，width: 100%; 现在可以在 Chrome、Firefox、IE、Opera 和 Safari 的当前版本中使用 textareas。

【讨论】：