シンプル・簡単にtextarea(テキストエリア)のサイズを指定する方法

テキストエリアのサイズを指定するには、 次のようにrows属性とcols属性を使って指定している方が結構います。


<textarea rows="10" cols="50"></textarea>

このようにrows属性とcols属性を使って指定しても、もちろんいいのですが、

ブラウザによって大きさが違ったりして、サイズの調整が面倒だったりします。

CSSのwidth、heightでサイズ指定する

rows属性、cols属性でサイズ指定するよりも、 もっとシンプルに指定できるのは、cssのwidth、heightを使う方法です。

CSSでは次のように指定します。


textarea {
	width: 200px;  /* 横幅 */
	height: 300px; /* 高さ */
}

このように指定することで文字数ではなく、 px等の単位で指定できるため、 ブラウザ毎にサイズが違うといった問題がなくなります。

CSSのwidth、heightプロパティを使う方がシンプル・簡単なのでオススメです。