フォームの入力エリアを中央揃えにする

フォームの入力エリアを中央揃えにできることを知らなかったので、備忘録としてメモしておきます。

サンプルコード

inputやtextareaに対してtext-align: center;を指定するだけです。

HTML

<dl>
	<dt>お名前</dt>
	<dd>
		<input type="text" placeholder="例) 佐天 涙子">
	</dd>
</dl>
<dl>
	<dt>質問内容</dt>
	<dd>
		<textarea placeholder="例) トナカイはいますか？"></textarea>
	</dd>
</dl>

CSS

input {
	width: 300px;
	text-align: center;
}
textarea {
	width: 300px;
	height: 80px;
	text-align: center;
}

入力エリアを中央揃えにするデモページ
あまり使うことはないかもですが、検索ボックスなどで使うといいかもしれません。