- ベストアンサー
</td><td>で改行されてしまうのは何故ですか？
以下、IE8で閲覧したときのみ [登録を許可する] と [拒否する] の ボタンが改行されて表示されてしまいます。 <td>登録を許可する</td><td>拒否する</td>としているので、 改行されるのはおかしいと思うのですが、IE8のバグでしょうか？ ちなみに、Firefox や Safari などでは二つのボタンは改行されず、 横並びできちんと表示されます。 また、以下ソース先頭のドキュメント宣言を削除すると、IE8でも 二つのボタンは改行されず、横並びで表示されます。 (多少上下位置がズレますが・・・) <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <body> <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr><td> 現在 <b>1件</b> の登録申請が出ています。<br /> そのうちの <b>1番目</b> の申請です。<br /><br /> <form method="post" action="./ps_admin.cgi"> <input type="hidden" name="act" value="reg2" /> <input type="hidden" name="page" value="0" /> <input type="hidden" name="pass" value="" /> <table border="0" cellpadding="0" cellspacing="0" style="text-align:left"> <tr><td> <table border="0" cellpadding="4"> <tr> <td bgcolor="#ffffff">▼お名前<br /> test</td> </tr> <tr> <td bgcolor="#ffffff">▼メールアドレス<br /> test<br /><br /></td> </tr> <tr><td bgcolor="#ffffff"><hr color="#444444"></td></tr> <tr> <td bgcolor="#ffffff"><br />▼サイト名<br /> <input style="width : 262px;" type="text" name="sitename" value="test" size="50" /></td> </tr> <tr> <td bgcolor="#ffffff">▼サイトURL<br /> <input style="width : 362px;" type="text" name="siteurl" value="http://" size="70" /><br /> <a href="" target="_blank">ページを見るときはこのリンクから</a></td> </tr> <tr> <td bgcolor="#ffffff">▼バナー<br /> 無し <input type="hidden" name="sitebanner" value="" /> </td> </tr> <tr> <td bgcolor="#ffffff">▼サンプルURL<br /> 無し <input type="hidden" name="sampleurl" value=""><br /><br /> </td> </tr> <tr> <td bgcolor="#ffffff">▼コメント<br /> <textarea style="width : 441px;" cols=70 rows=4 name="sitecomment">これはテストです。</textarea></td> </tr> <tr> <td bgcolor="#ffffff">▼キーワード<br /> <input style="width : 362px;" type="text" name="sitekeyword" size=70 value="テスト" /></td> </tr> <tr> <td bgcolor="#ffffff">▼管理人へのコメント<br /> <br /><br /></td> </tr> </table> <table> <tr><td> <input type="hidden" name="name" value="test" /> <input type="hidden" name="email" value="" /> <input type="hidden" name="npass" value="" /> <input type="submit" value="登録を許可する" /> </form></td> <td align="left"> <form method="post" action="./ps_admin.cgi"> <input type="hidden" name="act" value="reg3" /> <input type="hidden" name="page" value="0" /> <input type="hidden" name="pass" value="" /> <input type="hidden" name="name" value="test" /> <input type="hidden" name="sitename" value="test" /> <input type="submit" value="拒否する" /></form></td> </tr></table></td></tr></table> </td></tr> </table> </body> </html> IE8でのXHTML表示関連のバグでしょうか？ 解決できず大変困っています。 どなたか原因がおわかりになる方がおられましたら 解決策をお教え頂ければ幸いです。 宜しくお願い致します。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
ザックリとみた感じでは、 登録を許可する のセルの中で、<form>の閉じタグだけで開始タグがないですね。 開始タグは、テーブルの外の <form method="post" action="./ps_admin.cgi"> でしょうか。 つまり、この場合には、 <form> <table><tr><td>登録を許可する </form> </td><td> <form>拒否する</form> </td></tr></table> という状態になっているのがお分かり頂けるかと思います。 数式のカッコも一緒ですが (………)〔～～～～〕：二つのカッコが並列 や 〔(………)～～～～〕：大かっこの中に小カッコが存在 と書くことはあっても (………〔～～)～～〕のようにそれらのカッコが閉じることなしに次の新しいカッコが始まることはありません。 タグが閉じることなしに、次のタグと混在することはないのです。 ブラウザによってはそういった不明瞭な記載はある程度自己解決しながら何とか表示するようになっていますが、その自己修復がこちらの意図と違う場合には表示に不具合が出たり、動作が不安定になったりするようです。 こちらには、IE8の動作環境がありませんのでテストはできませんが、動作不具合の解消のヒントになればうれしいです。
その他の回答 (1)
- yyr446
- ベストアンサー率65% (870/1330)
No1の回答者さんがおっしゃているように 入れ子関係がおかしいですね。タブスペースでインデントしながら 書いていくと間違いにくいですよ。 それよりも、<table>に執着しすぎです。 結果のページを見るとそれほど複雑なレイアウトじゃないにもかかわらず.. 他のタグも組み合わせて親子関係をはっきりさせて、すっきり作りましょう。 <div></div>とか <ul><li></li><li></li></ul>とか 知らないのですか？ これくらいならCSSで細かく位置していしなくてもよさそうですよ。
お礼
ご回答ありがとうございます。 仰るとおりです。 もっと勉強します。
お礼
ご回答ありがとうございます。 不明瞭なタグの記載はデザインを優先してしまったためでして、 ある程度は問題ないかと思っていましたが、 やはり動作が不安定になる要因になるのですね。 とりあえず XHTML のドキュメント宣言、 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> だけを削除すると何故か上手く表示されましたので、 このページに限っては、この解決策を取りたいと思います。 (W3C的にも良い方法とは言えませんが・・・) この度はありがとうございました。