Html 表响应文本区域

如何使t车身高度随文本框高度变化。而不是文本框得到一个滚动条

---

这是我的HTML：

<table align="center" width="80%" border="1">
    <tbody class="tbody1">
//text entries - see fiddle
    </tbody>
    <tbody class="tbody2">
        <tr>
            <td>
                <textarea rows="1" style="width:100%" class="wide boxsizingBorder" autocomplete="off" name="txt" type="text" id="usermsg" value=""></textarea>
            </td>
        </tr>
    </tbody>
</table>

看

---

当我在文本区域输入文本时，它会创建一个滚动条，我希望tbody高度增加到最大25%，然后滚动。就像facebook那样

---

我怎么能做到这一点呢？

如果你想要一个纯HTML/CSS解决方案，我会让你失望的，你不能。当您愿意使用Javascript（jQuery）时，您可能会想研究一下。我同意使用jQuery！但这似乎不起作用。我已经试过了，但它对盒子大小不起作用！这是非常重要的annoying@LinkinTED如果你看，你可以使用角点的东西，使其增长，但当你输入文本时，它不会增长

textarea {
    resize: none;
}
.boxsizingBorder {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body {
    height: 100%;
    overflow: hidden;
    margin: 0;
}
table {
    height: 100%;
    overflow: hidden;
}
.tbody1{
    overflow: auto;
    width:100%;
    height:100%;
    display: block;
}
.tbody2{
    margin: 0;
}