- ベストアンサー
どのようなHTML、CSSを書けばいいのか？
添付画像のように、表示したいのですがどのようなHTML、CSSを書けばいいのでしょうか？ 具体的には ・「キーワード」と書かれた文字が中心に来るように線で囲む ・検索フォーム・ボタンは通常のtextarea、buttonです ・「キーワード」・「textarea」・「button」を横一列に表示 です。 宜しくお願い致します
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
この場合は、率直にtableで良いですよ。 ★こういうときこそ、tableを使う 表データだから virtical-alignが使える。 ★タブは＿に置換してあるので戻す。 <body> ＿<div class="header"> ＿＿<form action="http://www.google.co.jp/search"> ＿＿＿<table summary="searchForm" id="search" border="0"> ＿＿＿＿<tbody> ＿＿＿＿＿<tr> ＿＿＿＿＿＿<th>キーワード</th> ＿＿＿＿＿＿<td><input type="text" name="q" size="20" value=""></td> ＿＿＿＿＿＿<td><input type="submit" value="探す?"> ＿＿＿＿＿</tr> ＿＿＿＿</tbody> ＿＿＿</table> ＿＿</form> ＿</div> スタイルシートは table#search{ border-collapse:collapse; width:26em;margi:5px 5px 5px auto; line-height:2em; } table#search th{ border: red 1px solid; backgrund-color:rgb(255,160,160); vertical-align:middle; } table#search td{ border:none; vertical-align:middle; padding-left:5px; text-align:right; } table#search td+td{ text-align:left; }
その他の回答 (1)
- Ogre7077
- ベストアンサー率65% (170/258)
このような場合なら <textarea> ではなく <input type=text> ではないかと思いますが、それはともかく // css form strong { border:thin solid darkred; background:pink; padding:1ex; } form * { vertical-align: middle; } // html <form> <strong>キーワード</strong> <textarea></textarea> <button>探す?</button> </form>
