如何修复Firefox和Chrome中不一致的Textarea底部边距？

我正试图消除FF和Chrome似乎给Textareas带来的额外底部空白。 令人惊讶的IE似乎做对了。 我想避免使用条件包括，但CSS3的调整是确定的。

示例代码

.red-box { background-color: red; overflow: hidden; } textarea { border: solid 1px #ddd; margin: 0px; /* Has no effect */ } 

 <div class="red-box"> <textarea>No Margin Please!</textarea> </div> 

Answer 1

默认情况下，我相信Chrome和Firefox都会将这些元素设置为display: inline-block; 。 在你的风格中设置display: block ，你应该全部设置。

Answer 2

如果你想保持内联，只需尝试一下

 vertical-align: top 

Answer 3

为你的textarea设置display: block 。

Answer 4

只是禁用resize如下

textarea {resize：none;}