css - テキスト領域を div 要素とまったく同じにするにはどうすればよいですか?

Question

textareaすべてのブラウザで aと a のdiv外観をまったく同じにする必要があります。

私はこのコードを持っています: http://jsfiddle.net/eric777/XHtY9/

どうすればそれを達成できますか？

Answer 1

まず、すべてのブラウザーでまったく同じように見えるように強制するというアプローチは、なくなりつつあると思います。違いを受け入れて、ブラウザ間で入力などのスタイルをわずかに変える方がはるかに簡単です。とにかく、複数のブラウザを使用してサイトにアクセスする訪問者はほとんどいないため、違いに気付く人はほとんどいません.

それでは、実際の質問に答えてください。textarea/div がどのように表示されるかを指定していないため、プロパティの完全なセットを提供することはできませんが、それを実現する方法を次に示します。

1. このようなCSS リセット(他にもあります) を使用して、各ブラウザーによって適用される既定のスタイル設定を削除します。これで、ページはすべてのブラウザーで同じ外観で始まります。

2. div と textarea の両方に目的のスタイルを適用します。

3. コンテンツが収まらない場合、テキストエリアはデフォルトでスクロールします。divを使用して、要素に対してそれを偽造する必要がある場合がありoverflow-y: scroll;ます。