• ベストアンサー

フォームの構成部品(入力欄・ボタン等)を作成する<INPUT>タグについて

type属性である、「type="text"」と「type="password"」があります。この2つを段落(改行して)を入れて、横幅を同じにしたいのですが、OSによって幅が異なってしまいます。Windows2000では、デフォルト(size=20)値で、横幅は綺麗に揃ってくれるのですが、WindowsXPでは横幅が一致しません。何故ですか。また、解消方法はありますか。 参考ソース: <TR> <TD>ユーザーID:</TD><TD><INPUT TYPE="text" NAME="id" value=""></TD> </TR> <TR> <TD>パスワード:</TD><TD><INPUT TYPE="password" NAME="pass" value=""></TD> </TR>

  • burbe
  • お礼率35% (78/221)
  • HTML
  • 回答数2
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • hitomura
  • ベストアンサー率48% (325/664)
回答No.2

原因についてはNo.1の通りだと思います。 対策としては、CSSで幅を指定すればいいと思います。 参考ソース: <HTML> <HEAD> <STYLE TYPE="text/css"> .same_width {width:100px;} </STYLE> </HEAD> <BODY> <TABLE> <TR> <TD>ユーザーID:</TD><TD><INPUT TYPE="text" NAME="id" value="" class="same_width"></TD> </TR> <TR> <TD>パスワード:</TD><TD><INPUT TYPE="password" NAME="pass" value="" class="same_width"></TD> </TR> </TABLE> </BODY> </HTML>

その他の回答 (1)

  • seasoning
  • ベストアンサー率25% (182/713)
回答No.1

こんちは。 OSの違いではなく、ブラウザの違いだと思いますよ。たぶんIEのバージョンが違ってませんか? 解消方法は無かったような気がします。

burbe
質問者

お礼

ありがとうございました

関連するQ&A

  • フォームを作成 入力するところの大きさがおかしい

    ID・パスワード入力フォームを作成したのですが、 <input type=text name=ID size=20 value=""> <input type=password name=password size=20 value="" > 大きさが異なります。 どうしてなのか、理由を知りたく思います。 お知恵をお貸し下さい。

    • ベストアンサー
    • HTML
  • VBAでWebページに入力&ボタンクリック

    URLがhttp://xxx.com/のページで次のようなフォームのときExcelで自動入力クリックするマクロを作りたいです。 <input type="hidden" name="room" value="aaaaa"/> <a name="regist" id="regist">総登録数</a> <table width="402" border="1"> <tr> <th align="center" colspan="2"><div align="left"><big>登録ページ</big></div></th> </tr> <tr> <td colspan="2">&nbsp;&nbsp;&nbsp;name <input type="text" size="20" name="name" value="" maxlength="20"> &nbsp;&nbsp;&nbsp;Email <input type="text" size="20" name="email" value=""> &nbsp;&nbsp;</td> </tr> <tr> <td align="center">pass</td> <td><input type="text" size="20" name="pw" maxlength="12" value=""></td> </tr> <tr> <td align="center">category</td> <td><select size="1" name="junle"> <option value="pp" selected="selected">カテゴリ選択</option> <option value="0">その1</option> <option value="1">その2</option> </select></td> </tr> <tr> <td align="center">title</td> <td><input type="text" size="55" name="title" maxlength="25" value=""></td> </tr> <tr> <td align="center">URL</td> <td><input type="text" size="55" name="url"></td> </tr> <tr> <td align="center">intro</td> <td><input type="text" name="comment" size="55" maxlength="50" value=""></td> </tr> <tr align="center"> <td><br></td> <td><input type="submit" name="mode" value="登録"> <input type="reset" value="クリア"></td> </tr> </table> 入力する内容は1行目のA,B,C・・にname,email,pass・・・が順番にそれぞれ入っています。

  • ボタンを押してテキストボックスを追加しテーブルの作成

    avascriptでテキストボックスを追加したいのです。テーブルを組んで複数のnamaの違うボックスを追加したいです。 下記のようにイメージして書いたのですが、考えが詰まりました。 テーブルでなくても、2列複数行の形になればいいんですが・・・ 教えて下さい。よろしくお願いします。 <script type="text/javascript"> <!-- var tag_num = 4; function myAdd(){ var oTag = document.createElement("input"); oTag.setAttribute("type", "text"); oTag.setAttribute("name", "hoge" + tag_num++); oTag.setAttribute("name", "fuga" + tag_num++); var oDiv = document.getElementById("area"); oDiv.appendChild(oTag); } --> </script> </head> <body> <form id="form1" action="check.php" method="post"> <span id="area"> <table style="text-align: left; width: 100px;" border="1" cellpadding="2" cellspacing="2"> <tbody> <tr> <td><input type="text" name="hoge1" value=""></td> <td><input type="text" name="fuga1" value=""></td> </tr> <tr> <td><input type="text" name="hoge2" value=""></td> <td><input type="text" name="fuga2" value=""></td> </tr> <tr> <td><input type="text" name="hoge3" value=""></td> <td><input type="text" name="fuga3" value=""></td> </tr> </tbody> </table> </span> <input type="button" value="Add" onClick="myAdd()"> </form>

  • 入力フォームに半角スペース以降が表示されない

    Perlでプログラムを組んでいます。 「山田 太郎」とデータを書き込みました。 それを$nameという変数に入れてPerlで出力し、 HTMLのフォームで表示しようとすると 「山田」までしか表示されません。 フォーム以外ではちゃんと「山田 太郎」と表示されます。 入力フォームはINPUTTYPE=text maxlength=20 です。 スクリプトは以下のような感じです。 HTML出力部分のみ。 # フォームからの情報を連想配列 %form に入れる &init_form($kanjicode) ・・・・ print <<"EOD"; Content-type: text/html <HTML> <HEAD> $contenttype <TITLE>$title</TITLE> </HEAD> <body> $tabletag <UL> <LI>$nameさんパスワードは大文字小文字の違いに注意してください。</LI> ↑「山田 太郎」とちゃんと表示される </UL> <FORM ACTION=$thisurl METHOD=$method> <TABLE> <TR> <TD>氏名</TD> ↓ここでは「山田」までしか表示されない <TD><INPUT type=text size=20 maxlength=20 name=$name value=$name></TD> </TR> <TR> <TD>パスワード</TD> <TD><INPUT type=password size=4 maxlength=4 name=pass value=$pass></TD> </TR> <TR> <TD COLSPAN=2> <INPUT type=hidden name=cmd value=new2> <INPUT type=submit value=登録する> </TD> </TR> </TABLE> </FORM> </BODY></HTML> EOD なにかヒントがありましたら教えてください。

    • ベストアンサー
    • Perl
  • ラジオボタンとテキストボックスで、ボタン選択時のテキストボックスの入力チェックするにはどうしたらよいでしょうか?

    ラジオボタンとテキストボックスの組合わせで使用し、ラジオボタン選択時のテキストボックスの入力チェックをするにはどうしたらよいのでしょうか? 以下はそのhtmlソースになります。 <table border="0" cellspacing="2" cellpadding="0"> <tr> <td><input type="radio" name="addsearch" value="検索エンジン" id="p1"></td> <td colspan="2"><label for="p1"><span class="stress2">検索エンジン</span></label></td> </tr> <tr> <td></td> <td>検索エンジン名</td> <td><INPUT TYPE=text NAME="addsearch1" VALUE="" SIZE=40></td> </tr> <tr> <td><input type="radio" name="addsearch" value="ご紹介で" id="p2"></td> <td colspan="2"><label for="p2"><span class="stress2">ご紹介で</span></label></td> </tr> <tr> <td></td> <td>ご紹介者のお名前をおしえてください。</td> <td><INPUT TYPE=text NAME="addsearch2" VALUE="" SIZE=40></td> </tr> <tr> <td><input type="radio" name="addsearch" value="広告を見て" id="p3"></td> <td colspan="2"><label for="p3"><span class="stress2">広告を見て</span></label></td> </tr> <tr> <td></td> <td>どこの広告ですか?</td> <td><INPUT TYPE=text NAME="addsearch3" VALUE="" SIZE=40></td> </tr> <tr> <td><input type="radio" name="addsearch" value="その他" id="p4"></td> <td colspan="2"><label for="p4"><span class="stress2">その他</span></label></td> </tr> <tr> <td></td> <td>具体的にお願いします。</td> <td><INPUT TYPE=text NAME="addsearch4" VALUE="" SIZE=40></td> </tr> </table> よろしくおねがいいたします。

    • ベストアンサー
    • HTML
  • 配布されてるCGIをダウンロードしたのですが

    CGIは超がつくほどの初心者ですがサーバーへは無事に接続できたみたいです。 でも、接続時にCGIプログラム?から指定のIDが見当たりません。 このように表示されます。 それで質問させていただきたいのです。 IDとパスワードを入力する必要があるとCGIの説明にも載ってたので、 任意のIDとパスワードを入力する。と でもどこに入力すればいいのか? 詳しい方か分かる方が入たら教えてください。 print "<tr><td align=\"right\">User ID</td><td><input type=\"text\" name=\"usr\" value=\"\"></td></tr>\n"; print "<tr><td align=\"right\">Password</td><td><input type=\"password\" name=\"pass\" value=\"\"></td></tr>\n" 超初心者ですいません。

    • 締切済み
    • CGI
  • input type ボタン

    お世話になります。 inputtype ログインボタン・検索ボタンの事で、お尋ねいたします。 あちらこちらのサイトを参考にログインと検索ができるプログラムを 真似て作成いたしています。初めての事で内容も半分ぐらいしか理解出来ていないままのスタートです。 参考サイトのhtml部分・CSSソースを作りかけの自分のサイトに記載しますとログインボタンと検索ボタンのレイアウトが崩れて 表示されません。 何が原因なのか不明のままです!! お手数かけますが、ご指導お願い申しあげます。 下記に簡単にinputの部分だけソースを書きますので宜しくお願い いたします。 また別ページ(新規に)html<body>~<body>間に同じソースを 書きますと検索ボタンもログインボタンもきちっと表示されます。 中身のプログラムソースに入る前にレイアウトを先に手掛けたのですが 意気消沈しています。 他のCSSとかjavascriptかのソースと競合するのでしょうか? 解らない事ばかりです。 奇麗に表示ができれば幸いです。 宜しくお願い申し上げます。 googleサーチのinputです。 <div class="entry_search"> <form method="get" action="http://www.google.co.jp/search" target="_parent"> <table width="166" border="0" bgcolor="#ffffff"> <tbody> <tr> <td width="160" height="32" align="left" valign="top" nowrap="nowrap"><a href="http://www.google.co.jp" target="_blank"> <img src="imges/common/poweredby_google.gif" alt="Google" border="0" /></a> <br /> <input type="text"name="q" size="17" maxlength="255" value="" /> <input type=hidden name=ie value=Shift_JIS /> <input type=hidden name=oe value=Shift_JIS /> <input type="hidden" name="hl" value="ja" /> <input type="hidden" name="domains" value="#" /> <input type="submit" name="btnG" value="検索" /></td> </tr> <tr> <td nowrap="nowrap"><table> <tbody> <tr> <td ><input type="radio" name="sitesearch" value=" " /> <font color="#000000" size="-1">Web</font></td> <td><input type="radio" name="sitesearch" value="#" checked="checked" /> <font color="#000000" size="-2">サイト内</font></td> </tr> </tbody> </table> <input name="client" value="pub-5778690733142083" type="hidden" /> <input type=hidden name=ie value=Shift_JIS /> <input type=hidden name=oe value=Shift_JIS /> <input type=hidden name=hl value="ja" /> <input name="cof" value="GALT:GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:ffffff;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;" type="hidden" /> <input type="hidden" name="hl" value="ja" /></td> </tr> </tbody> </table> </form> こちらがログオンの一部です。 <div class="AA_approach_b"> <h4 class="AA_blockHead AA_loginHead">ログイン</h4> <form name="login" action="#" method="post"><input name="action" value="login" type="hidden"> <input name="#" value="4b96bbf140d2a3cb9821cc2cba76395e21feb0f5b9ab041b561f0a03fc15ef2a" type="hidden"><table class="bestfood_loginTable"> <tbody><tr> <th class="CC_th">E-mail</th> <td class="CC_td"><input name="loginEmailAddress" value="" type="text"></td> </tr> <tr> <th class="CC_th">password</th> <td class="CC_td"><input name="loginPassword" value="" type="password"></td> </tr> <tr> <td colspan="2" button type="class="CC_submit" value="submit"> <input value="ログイン" type="submit"> </button> </td> </tr> </tbody></table> <div class="AA_annotation"><a href="#">パスワードをお忘れの方</a></div> <input name="referer" value="block" type="hidden"> </form> 上記の他にCSSと手元にCGIソースがあります。 お手数ですが宜しくお願い申し上げます。 初めての事ですので表現や考えに間違いありますればご容赦を....!!

  • フォームに入力したテキストを別フレームのフォームに反映させるには?

    上と下でフレーム分けしたページで、以下のような構成です。 上段フレームのフォームに入力した内容を、フォームの右側に設置した変更ボタンを押すことで、 下段フレームのプルダウンメニューとテキストフィールドに上記の構成のような感じで反映させたいのです。 社員番号の反映までのスクリプトを書いたところで、わからなくなってしまいました。 名前・部署・営業所・年齢も反映させるにはどうすればいいでしょうか? 画面イメージ----------------------------------------------------------- 社員番号 名前    部署  営業所 年齢 [I00001] [山田太郎] [営業] [東京] [25] 【変更ボタン】 [I00002] [鈴木次郎] [販売] [大阪] [30] 【変更ボタン】 =======================================================================  社員番号   名前      部署    営業所  年齢 《I00001▼》 《山田太郎▼》 《営業▼》 《東京▼》 [25] ------------------------------------------------------------------------ [XXXXX]がテキストフィールド、 《XXXXX▼》がselectのプルダウンメニューでいくつか選べるようになっています。 ★上段(ue_frame.html)★ <html> <head> <title>社員情報</title> <script language="JavaScript"><!-- function sendData(id) { syainbangou_label = id+"_syainbangou"; syainbangou_value = document.getElementsByTagName(syainbangou_label).value; //alert(parent.ue_frame.document.entry.syainbangou.options.length); for(count=0; count<parent.ue_frame.document.entry.syainbangou.options.length;count++){ if(id == parent.ue_frame.document.entry.syainbangou.options[count].value) { parent.ue_frame.document.entry.syainbangou.options[id].selected=true; } } } // --> </script> </head> <body> <form> <table> <tr> <td>社員番号</td><td>名前</td><td>部署</td><td>営業所</td><td>年齢</td><td></td><td></td><td></td> </tr> <tr> <td><input type="text" name="1_syainbangou" value="I00001"></td> <td><input type="text" name="1_syain_namae" value="山田太郎"></td> <td><input type="text" name="1_busyo" value="営業"></td> <td><input type="text" name="1_eigyousyo" value="東京"></td> <td><input type="text" name="1_age" value="25"></td> <td></td> <td><input type="button" value="変更" name="1_update" onClick="sendData(1)"></td> </tr> <tr> <td><input type="text" name="2_syainbangou" value="I00002"></td> <td><input type="text" name="2_syain_namae" value="鈴木次郎"></td> <td><input type="text" name="2_busyo" value="販売"></td> <td><input type="text" name="2_eigyousyo" value="大阪"></td> <td><input type="text" name="2_age" value="30"></td> <td></td> <td><input type="button" value="変更" name="2_update" onClick="sendData(2)"></td> </tr> </table> </body> </html> ★下段(sita_frame.html)★ <html> <head> <title>社員情報登録</title> <script language="JavaScript"><!-- // --></script> </head> <body> <form name="entry"> <table border="0"> <tr> <td>社員番号</td><td>名前</td><td>部署</td><td>営業所</td><td>年齢</td><td></td> </tr> <tr> <td> <select id="syainbangou"> <option>社員番号を選択 <option value=1>1.I00001 <option value=2>2.I00002 </select></td> <td> <select> <option>名前を選択 <option>1.山田太郎 <option>2.鈴木次郎 </select></td> <td> <select> <option>部署を選択 <option>1.営業 <option>2.販売 </select></td> <td><select> <option>営業所を選択 <option>1.東京 <option>2.大阪 </select></td> <td><input type="text" name="age" value="0"></td> </tr> <table> </form> </body> </html>

  • DWでのメールフォーム作成

    こんにちは。 DWMXでメールフォーム作成をしたのですが、web上で送信ボタンを押すとなぜかメールアプリケーションが立ち上がって、宛先に送信先のアドレスが表示されています。 メールフォームとは送信ボタンを押すとフォームの内容がそのまま送信先に送信されるものですよね? 以下構文です。なにかおかしいのでしょうか。よろしくおねがいします☆ <form action="mailto:自分のアドレス" enctype="text/plain" name="mailform" id="mailform"> <table width="304" border="0" cellspacing="1" cellpadding="1"> <tr> <td><div align="center">name</div></td> </tr> <tr> <td><div align="center"> <input type="text" name="textfield"> </div></td> </tr> <tr> <td><div align="center">mail adress</div></td> </tr> <tr> <td><div align="center"> <input type="text" name="textfield2"> </div></td> </tr> <tr> <td><div align="center">件名</div></td> </tr> <tr> <td><div align="center"> <input type="text" name="textfield3"> </div></td> </tr> <tr> <td><div align="center">本文</div></td> </tr> <tr> <td><div align="center"> <textarea name="textarea"></textarea> </div></td> </tr> <tr> <td>&nbsp;</td> </tr> <tr> <td><div align="center">   <input type="submit" name="Submit" value="送信"> <input type="reset" name="Submit2" value="リセット">

  • パスワード入力フォームのガイドの制作するには・・・?

    入力フォームにデフォルト値でガイド的な文字を入れ フォームクリックでガイド文字が消え、入力できるようになるものを 作りたいのですが input type="text" のフォームはできましたが input type="password" のフォームに実装すると ガイド文字も●●●●と表示されてしまいます。 これを制作するのは無理なのでしょうか? 以下はサンプルで作ったソースです。 ------------------------------------------------------------------- <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>テスト</title> </head> <body> <div class="id_box"><input type="text" name="id" onfocus="if (this.value == 'アカウントID') this.value='';" value="アカウントID"></div> <div class="pw_box"><input type="password" name="pass" onfocus="if (this.value == 'パスワード') this.value='';" value="パスワード"></div> </body> </html> ------------------------------------------------------------------- たぶんjavascriptだと思うのですがよろしくお願いします。

専門家に質問してみよう