中央に配置

CSSで下記の各タグのwidthはパーセントで設定してテキストボックス、ボタン、リンクを中央に配置したいのですがどうしたらいいのでしょうか。

<form id="form1" action="" method="post" name="form1">
<div id="topCouponSearch">
<span class="topCouponSearcha">

<input id="address" class="topCouponSearcha2" type="text" value="（例）住所・駅名・郵便番号・ランドマークを入力" name="address" style="color: #999999;">
<button id="getad">検索</button>
<span class="topCouponSearcha3">
<a href="?act=u05">店舗一覧</a>
</span>

</span>
</div>
</form>

No.1 回答者： ORUKA1951 回答日時： 2013/03/02 09:38

各タグ?ではなく各要素ですね。

<p>ここは段落というブロック要素</p>
↑　　　　　　　　　　　　　　　　　　↑
タグ←----要素の内容----→タグ(終了タグ)
←----------要素------------→
正しく使わないと他人に意味がまったく伝わりません。
『要素はタグではない。 例えば「Pタグ」といった具合に、要素のことをタグという人もいる。しかし、要素は要素であり、タグはタグである』
　⇒3.2 HTMLで用いられるSGML構成素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

　また、HTMLにはブロック要素と行内要素(インライン要素)というとっても大事な区別があります。
　⇒7.5.3 ブロックレベル要素と行内要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

　span要素、input要素はインライン要素ですから、widthやheightは、内容(↑上記)に従います。非置換インライン要素とよばれます。img要素も行内要素ですが、テキストが他のものに置き換わるので置換インライン要素で属性によってサイズが決められます。

HTMLを正しく書き直すと
<form id="form1" action="" method="post" name="form1" style="text-align:center">
<p><input type="text" value="（例）住所・駅名・郵便番号・ランドマークを入力" name="address" width="60"></p>
<p><button id="getad">検索</button></p>
<p><a href="?act=u05">店舗一覧</a>
</form>
たったこれだけで良いです。

いちど仕様書に目を通しておきましょう。最初にすべきことですよ。