css - 如何摆脱 chrome 浏览器中 textarea 底部与其包装 div 之间的差距？

Question

我正在尝试在https://gist.github.com/页面中创建一个类似于描述字段的框。这是我的最小示例。如您所见（仅在 chrome 中），包装 div 之间的 textarea 底部有一个间隙。我怎样才能摆脱它？

<div style="
    padding: 3px;
    background-color: #eee;
    border-radius: 3px;
    width: 200px;">

      <div style="border: 1px solid #ccc;">
         <textarea style="width: 194px; resize: vertical; border: 0px; height: 124px; margin: 0px;"></textarea>
      </div>
    </div>

这里有一个类似但很老的问题，答案没有帮助。

Answer 1

诀窍是把 textareadisplay: block;归功于yuxel

只是一个说明：css 重置（雅虎的）不会改变 textarea 的显示。

Answer 2

<div style="
padding: 3px;
background-color: #eee;
border-radius: 3px;
width: 200px;">

  <div style="border: 1px solid #ccc; margin:0; padding:0;">
     <textarea style="width: 194px; resize: vertical; border: 0px; height: 124px; margin: 0px; top:0; right:0; bottom:0; left:0;"></textarea>
  </div>
</div>

是这样吗？