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>
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
各タグ?ではなく各要素ですね。
<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>
たったこれだけで良いです。
いちど仕様書に目を通しておきましょう。最初にすべきことですよ。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlの文字が縦書きになる
-
テーブルの行を折りたたみたい...
-
htmlソース編集で、各タグを何...
-
css初心者 フレックスボックス...
-
角丸画像の背景色を透明にした...
-
iPhoneで HTMLファイルを閲覧
-
テーブルタグのセルの幅の一部...
-
スマホでHTMLファイルを開いて...
-
URLにアクセスした際に指定した...
-
アコーディオンメニューが思う...
-
CSSファイルの日本語コメントが...
-
CSSが上手く反映されないみたい...
-
コードを書いて下さい( ; ; )...
-
CSSデータの作成方法について(...
-
htmlで<form>~</form>を並べて...
-
HTML入門でもう躓いてしまった。
-
青い枠のみのHTML
-
スマホ(android)のタッチパネ...
-
HTMLですCSSです 画像のように...
-
、URL化させるにはどうしたらい...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlの文字が縦書きになる
-
テーブルのセルデータを自動改...
-
goo は、放置?
-
htmlソース文の 各行 改行位置...
-
1つの「ホームページビルダー2...
-
HPレイアウトが同じページのヘ...
-
CSS、Bootstrapについて contai...
-
CSSについて教えてください。 ...
-
静止画画像をクリックすると音...
-
、URL化させるにはどうしたらい...
-
テーブルの行を折りたたみたい...
-
css初心者 フレックスボックス...
-
WEBページを強制的に横画面で見...
-
Webページのリンクの貼り方を教...
-
Duolingo のソースコードの名前...
-
メモ帳の段落の揃え方
-
スマホ(android)のタッチパネ...
-
コードを書いて下さい( ; ; )...
-
HTMLで画像をポップアップで表...
-
角丸画像の背景色を透明にした...
おすすめ情報