html - 如何让 textarea 占用 100% 的剩余空间？

Question

我有一个具有以下结构的 div：

<div class = "card">
   <div class="menu">
      vertical menu here, pushed to the left
   </div>
   <div class ="content">
      <textarea> This should fill up everything in the card exept the menu div</textarea>
   </div>
</div>

我试图让'textarea'填满整个卡片，同时将菜单留在那里。我的 jsfiddle 显示它有点太宽，并出于某种原因推到卡片 div 下方：

http://jsfiddle.net/PTSkR/105/

我怎样才能让那个 textarea 填满剩余的卡片空间？

Answer 1

如果你想要这样的东西：http: //jsfiddle.net/PTSkR/107/，

您可以通过使用float:left菜单、float:right文本区域和CSS3 Calc计算文本区域的宽度来实现它，如示例中所示