web-dev-qa-db-ja.com

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>
csshtmlcross-browsertextarea
46
Tim Santeford

デフォルトでは、ChromeとFirefoxの両方がこれらの要素をdisplay: inline-block;として設定すると思います。スタイルにdisplay: blockを設定すると、すべて設定されているはずです。

87
kmfk

インラインのままにしておきたい場合は、試してみてください

vertical-align: top
10
David Vielhuber

セットする display: blockテキストエリア用。

2
Hameed