• ベストアンサー

テーブル幅100% 右端に何故か空白 更新すれば直るけど・・

ちょっと行き詰まったのでご回答お願いいたします。 テーブル幅を100%にしたものをHTMLに用意しているのですが、IE5.5で見ると、それが右端だけ空白があいてしまうのです。 リロードしたら空白は消えるのですが、普通にリンクでそのページにとぶと右端に空白ができています。 NS6.2で確認したら、問題なく100%広がっていました。 HTMLに明るい友達にきくと、余計な空白が入っていたらなるかもといわれ、テーブル周りの半角スペースも取り除きましたが、改善されませんでした。 同じような現象になった方、またそれを回避した方お答えくださいますようお願いいたします。 以下、問題のHTMLです <html> <head> <title>top.html</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> </head> <body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <center> <table width="100%" border="0" bgcolor="#FF9933"> <tr> <td nowrap><font size="2">ほげほげ</font></td> <td><font size="2"> </font></td> <td nowrap><font size="2"> </font></td> </tr> </table> <br> <br> (割愛) </center> </body> </html>

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

  • ベストアンサー
  • a-kuma
  • ベストアンサー率50% (1122/2211)
回答No.2

IE のバグっぽいですね。 とりあえず、手元の環境では body に rightmargin=0 を入れたら OK でした。

hanywa
質問者

お礼

ご回答ありがとうございます。 "rightmargin=0"抜けてましたね。うっかりしてました。 入れたら無事に空白が埋まりました! ありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (2)

  • momococo
  • ベストアンサー率27% (20/72)
回答No.3

こちらでも再現しました。 No.2の方と同感で、IEのバグでしょう。 こちらでは、 <table width="100%" border="0" bgcolor="#FF9933"> を <table width="102%" border="0" bgcolor="#FF9933"> としたら解決しました。 ちょっと気持ち悪いですけど・・・。

hanywa
質問者

お礼

ご回答ありがとうございます。 width="102%"!!! 直りましたが確かに気持ち悪いですね(^^; ちなみに気になったので102%にした状態でNS6.2で確認したんですが、102%だと横スクロール出ないんですね。 No.2さんの方法で解決したので、ソースの見た目上No.2さんの方法をとらせていただきますが、必殺技として覚えておきます(笑)

全文を見る
すると、全ての回答が全文表示されます。
  • gomaabura
  • ベストアンサー率23% (166/707)
回答No.1

こんにちは。 更新すれば直るなら、ちゃんとファイルはアップロードされていると思いますよ。 一回、インターネットオプションのファイルの削除や、履歴を消したり、 もう一回FTPか何かの方法でサーバー上のデータを消して、 アップロードしたら大丈夫ではないでしょうか。 (割愛)って部分が妙にうけたので、回答させてもらいました(笑) 他にも原因があるかもしれないですが、このくらいしか私には分かりません。

hanywa
質問者

お礼

回答ありがとうございます。 よもやそんなところで受けるとは(笑) そうなんですよ、更新すれば直るんですよ。 でもキャッシュ消しても何してもやっぱり最初は空白が空くんですよ(涙) 大抵の場合IEは大丈夫だけどNSはダメなのに、これに関してはNSでOKなのにIEでだめ。 IEのバグですかねぇ。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • テーブルだらけのページをスッキリさせたい

    いま、ホームページビルダーで趣味のサイトを作っているところなのですが、 HTMLのことでわからない事があるので教えてください。 現在、大きなテーブルの中にさらに小さなテーブルをいれています。 そのためタグがとてもごちゃごちゃしています。 小さなテーブルはサイト更新の度に追加していく予定なので、 見た目よりデータが重いページになってしまうと思います。 これをなんとかスッキリさせたいのですが 良い方法はあるでしょうか? スタイルシートを使えばいいのでしょうか? どのように使用すれば無駄の無い形になるか 具体的なアドバイスをいただけると助かります。 参考までに作りかけのタグを載せました。 悪い部分等があったら、ぜひお願いします。 よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>サイト名「タイトル未定」</TITLE> </HEAD> <BODY> <CENTER> <TABLE border="0" cellpadding="0" cellspacing="0" width="840"> <TBODY> <TR> <TD colspan="2" align="center" height="40">サイト名 タイトル</TD> </TR> <TR> <TD colspan="2" align="center">サイトの説明と注意事項</TD> </TR> <TR> <TD colspan="2" height="15"> <HR> </TD> </TR> <TR> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#009900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">チューリップ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月1日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#999900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">さくら</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月2日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> </TR> <TR> <TD align="center"></TD> <TD align="center"></TD> </TR> <TR> <TD colspan="2"> <HR> </TD> </TR> </TBODY> </TABLE> </CENTER> </BODY> </HTML>

  • テーブルが二つ横に並んでしまう

    タイトルの通りりです。 どうして横にならんでしまうのか、いまいち よくわかりません。 どなたか教えて頂けないでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML LANG="JA"> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=Shift_JIS"> <META HTTP-EQUIV="CONTENT-STYLE-TYPE" CONTENT="text/css"> <TITLE></TITLE> </HEAD> <STYLE TYPE="text/css"> <!-- BASEFONT { font-size: x-small; } BODY { background-image: url( top/back_line.gif ); background-repeat: repeat-y; margin-left: 30px; } --> </STYLE> <BODY BGCOLOR="#9900CC" TEXT="#FFCCFF" LINK="#FF66CC" ALINK="#66CCFF" VLINK="#000066"> <BASEFONT FACE="Verdana, MS Pゴシック, Osaka"> <!-- ********************** --> <TABLE BORDER="3" CELLSPACING="3" CELLPADDING="3" ALIGN="LEFT" WIDTH="550"> <TR> <TD>aaa</TD><TD>bbb</TD> </TR> <TR> <TD>eed</TD><TD>sss</TD> </TR> </TABLE> <BR> <TABLE BORDER="3" CELLSPACING="3" CELLPADDING="3" ALIGN="LEFT" WIDTH="550"> <TR> <TD>aaa</TD><TD>bbb</TD> </TR> <TR> <TD>eed</TD><TD>sss</TD> </TR> </TABLE> <!-- ********************** --> </BODY> </HTML>

    • ベストアンサー
    • HTML
  • Firefoxでテーブルの外側の背景色が出ない

    IE8では中央にテーブルが配置し外側の背景色が出るのですが、Firefoxではテーブルの位置も左側に寄り、外側の背景色がテーブル内と同じ白一色になってしまうのですが、どう直したらいいのでしょうか。 以下、ソースです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 9.0.0.0 for Windows"> <TITLE>○○○</TITLE> <STYLE TYPE="text/css"> <!-- BODY {background:'palegreen';color:#000000;text-align:center;} TABLE {background:#FFFFFF;color:#000000;} CAPTION {background:#FFFFFF;color:#000000;text-align:left;font-weight:bold;} .tmscntr {text-align:center;font-size:14px;font-family:'Times New Roman';} .tmsrght {text-align:right;font-size:14px;font-family:'Times New Roman';} .tmslft {text-align:left;font-size:14px;font-family:'Times New Roman';} SPAN {margin-left:20PX;"}}}}}}}} .cntr {text-align:center;} .rght {text-align:right;} .lft {text-align:left;} A:visited {color:#000099;} A:active {color:#FFFFFF;background:#CCCCFF;} A:hover {color:#DCDCDC;background:#000099;} --> </STYLE> </HEAD> <BODY text="#000000" bgcolor="#FFFFFF" link="#ff3535" vlink="#808080" alink="#ff8040"> <DIV><BR> <TABLE cellpadding=5 cellspacing=0><CAPTION>○○○</CAPTION><TR><TD> <TABLE border="0" cellpadding=5 cellspacing=0><CAPTION>○○○</CAPTION> <TR><TD><b>(1)○○○</b></TD><TD><b>○○○</b></TD><TD colspan="3"><b>○○○○○○</b> <b><font color="#ff0000">○○○</b></font></TD></TR> <TR><TD></TD><TD style={text-indent:24px;}><b>○○○</TD><TD><b>○○○○○○○○○</b></TD></TR> <TR><TD><br><b>(2)○○○</b></TD><TD><br><b>○○○</b></TD><TD colspan="3"><br><b>○○○<b><font color="#008800">○○○○○○○○○</b></font></TD></TR> <TR><TD></TD><TD style={text-indent:24px;}><b>○○○</b></TD><TD><b>○○○○○○○○○</b></TD></TR> <TABLE align="center"><br><br><br> </TABLE> </TD></TR></TABLE></DIV> </BODY> </HTML>

  • Dreamweaverのデザインで表示がおかしい時

    IEだと綺麗に表示されるけど、Dreamweaverのデザインで見ると表示がおかしい時って結構あり困ってます。 ソースフォーマットとかやってもやはり駄目です。 今回の場合、どのタグが悪そうでしょうか? <HTML> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=EUC-JP"> </HEAD> <BODY> <BR> <BR> <BR> <TABLE align="center" cellSpacing=0 cellPadding=0 width="95%" bgColor=#0066cc border=0> <TBODY><TR><TD> <TABLE cellSpacing=2 cellPadding=1 width="100%" border=0> <TBODY> <TR bgColor=#0066cc> <TD align=middle><SMALL><B><FONT color=#ffffff> テキストツール </FONT></A></B></SMALL>&nbsp; </TD></TR> <TR bgColor=#ffffff> <TD align=middle> <TABLE height="400" cellSpacing=0 cellPadding=1 width="95%" border=0> <TBODY> <TR valign=top> <TD width="100%" valign="center" align="center"> <BR><A>トップページ</A><BR><BR> </TD> </TR> <TR valign=top> <TD width="100%" valign="top" align="center"> <A HREF="list">あ</A><BR><BR> <A HREF="clist">い</A><BR><BR> <A HREF="slist">う</A><BR><BR> </TD> </TR> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE> </BODY></HTML>

  • ▲▲テーブルと一緒に<FONT size="2"></FONT>は使えない?

    こんばんは☆僕は今テーブルを利用してカラーコード一覧を作成しています。そこで日本語の文字を入力したのですが…<FONT size="2">Color Code一覧</FONT>と「テーブルの外に」入力すると【Color Codeˆ&ecirc;—— 】←のように表示されます…。直接【Color Code一覧】入力すると問題はありません。なぜでしょうか?わかる方教えてください☆ <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> </FONT size="2">Color Code一覧</FONT> <TABLE Border Cellspacing="1"Width="20%" align="center"> <TR> <TD><FONT size="3" face="MS UI Gothic"><DIV align="center">Collar Code・RGB</DIV></FONT></TD> </TR> </TABLE> <BR> <TABLE Border Cellspacing="1" Width="75%" align="center"> <TR> <TD colspan="6"><FONT size="3" face="MS UI Gothic"><DIV align="center">#000000 - #00ffff</DIV></FONT></TD> </TR> <TR> <TD BgColor="#000000"><FONT size="3" face="MS UI Gothic"><DIV align="center">#000000</DIV></FONT></TD> <TD BgColor="#000033"><FONT size="3" face="MS UI Gothic"><DIV align="center">#000033</DIV></FONT></TD> <TD BgColor="#000066"><FONT size="3" face="MS UI Gothic"><DIV align="center">#000066</DIV></FONT></TD> ~~~~~~~~~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~~~~~~~~~ </TR> </TABLE> </BODY> </HTML>

    • ベストアンサー
    • HTML
  • テーブルの上に余白ができてしまいます

    パソコンから見たときはなんともないのですが、携帯から見ると大きい余白がでてしまって困っています。 解決方法を教えていただけませんか? それと、できれば下記のHTMLの添削をしてもらいたいです。 <html> <head> <meta http-equiv="Content-type" content="text/html; charset=shift_JIS"> <style type="text/css"> <!-- a:hover { position: relative; top: 1px; left: 1px; text-decoration: none; } a img { border: none; } --> </style> </head> <body bgcolor="#FFFFFF" link="#000000" vlink="#000000" alink="FFFFFF" text="#000000"> <center> <Table style="margin:-84px 0px 0px 0px" border="0" bgcolor="#336666" cellpadding="10"><tr><td> <div align=center><font size="2">タイトル</font></div> <font size="1"><font color="#000000">本文</font> </body></html>

  • 表示すると文字化けします

    下記のファイルが表示されると文字化けしてエンコードを修正しないとみれませんなぜでしょうか? 日本語EUCになってしまします。 <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> </HEAD> <BODY> <TABLE border="1"> <TBODY> <TR> <TD bgcolor="#ffff00" width="699"><B><FONT size="+2">登録ありがとうございました</FONT></B></TD> </TR> <TR> <TD height="99" width="699"><B>■<A href="http*************************">使いこなすために</A>手順に沿って進んでください</B>→<A href="http**************************">次へ進む</A></TD> </TR> </TBODY> </TABLE> </BODY> </HTML>

    • ベストアンサー
    • HTML
  • テーブルの線について

    下記のようなHPをつくっています。 一番大きなテーブルの上下の線を消すにはどこをどのようにすればいいのでしょうか? ご回答いただけると嬉しいです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS"> <title></title> <style type="text/css"> <!-- BODY TD { FONT-SIZE: 10pt } A.menu:link,A.menu:visited { BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #666666 1px solid; COLOR: #ffffff; PADDING-TOP: 12px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 40px; BACKGROUND-COLOR: pink; TEXT-DECORATION: none } A.menu:hover,A.menu:active { BORDER-RIGHT: #ffffff 1px ridge; PADDING-RIGHT: 15px; BORDER-TOP: #ffffff 1px ridge; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ffffff 1px ridge; COLOR: gray; PADDING-TOP: 12px; BORDER-BOTTOM: #ffffff 1px ridge; HEIGHT: 40px; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none } --> </style> </head> <body bottommargin="0" background="sozai/kabegami.gif" topmargin="0"> <table height="100%" cellspacing="1" cellpadding="1" width="730" align="center" bgcolor="#c0c0c0" border="0"> <tr> <td bgcolor="#ffffff" colspan="2"> </td> </tr> <tr> <td bgcolor="#ffffff" colspan="2" height="120" background="sozai/title_back.gif"> <p align="center"><img height="50" alt="" src="sozai/title.gif" width="369" border="0"></p></td> </tr> <tr> <td bgcolor="#ffffff" colspan="2" valign="top" align="left"><br> <table cellspacing="0" cellpadding="0" width="155" align="left" border="0"> <tr> <td> <table style="MARGIN-TOP: -2px; FONT-WEIGHT: bold; WIDTH: 146px; FONT-FAMILY: 'mspゴシック'; HEIGHT: 241px" cellspacing="3" cellpadding="0" width="146" align="center" border="0"> <tr> <td style="BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 10px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #666666 1px solid" align="center"><font color="gray">Top</font></td> </tr> <tr> <td><a class="menu" href="">News</font></a></td> </tr> <tr> <td><a class="menu" href="">作品集</font></a></td> </tr> <tr> <td><a class="menu" href="">お教室情報</font></a></td> </tr> <tr> <td><a class="menu" href="">Shopping</a></td> </tr> <tr> <td><a class="menu" href="">お友達サイト</a></td> </tr> </table> <p align="center"> <img src="http://counter1.fc2.com/counter_img.php?id=47426"><br> </p></td></tr></table> <table cellspacing="1" bgcolor="#c0c0c0" border="0" cellpadding="20" width="565" align="left"> <tr> <td bgcolor="#ffffff" ><br> <br><br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br><br> <br> </td> </tr> </table> </td></tr> <tr> <td bgcolor="#ffffff" colspan="2"> <p align="center"> <font color="#808080">Copyright &copy; 2005-2007 princess-ichigo, All rights reserved.</font></font></p></td> </tr> <tr> <td bgcolor="#ffffff" colspan="2"><br> </td> </tr> </table> </body></html>

    • ベストアンサー
    • HTML
  • (超初心者)ウインドウサイズを小さくするには。

    今、HPB9.0にて、以下のページに対し、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <BODY> <TABLE border="0"> <TBODY> <TR> <TD height="0" align="center" width="248"><FONT color="#ff0000">パスワードが誤っています。<BR> 再度入力して下さい。</FONT></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> 以下のような記述で、サイズを指定したいのですが、 <script type="text/javascript"> <!-- window.resizeTo(300, 300); // --> </script> どこに(どのように)記述をすれば良いでしょうか? ご教示下さい。

  • HTMLのJavaScriptが動作しない

    以下のプログラムのとおり、HTMLにテキストボックスを設置して、FORMタグのACTIONで次のPHP(PHTML)ファイルへ送る仕組みを作っています。 JavaScriptでテキストボックスが空白の場合にチェックするようにしているのですが、動作せずに次のPHPへ渡してしまいます。 詳しい方よりご教授頂ければと思います。 お手数お掛けして申し訳ございませんが、よろしくお願いいたします。 ・HTML # more index.html <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <SCRIPT language=JavaScript type=text/javascript> function generatorCheck(){ if(document.toroku.word1.value == ""){ alert("空白です。"); return false; } if(document.toroku.word2.value == ""){ alert("空白です。"); return false; } } </SCRIPT> <form method="POST" action="result.phtml"> <TABLE cellpadding=10> <tr><td><B>入力項目1</B></td><td><input type="text" name="word1" size=34></td><td>(例:)</td></tr> <tr><td><B>入力項目2</B></td><td><input type="text" name="word2" size=34></td><td>(例:)</td></tr> </table> <BR> <input type=submit value="作成" onClick=generatorCheck()><input type=reset value="消去"> </form> </TABLE> </BODY> </HTML> ・PHP(PHTML) # more result.phtml <? require('../include/init.inc'); $word1 = $_POST{'word1'}; $word2 = $_POST{'word2'}; ?> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> <LINK href="index.css" type="text/css" rel="stylesheet"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <? print ("</BR>"); print ("<B>".$word1."</B>"); print ("</BR>"); print ("<B>".$word2."</B>"); print ("</BR>"); ?> </BODY> </HTML>

    • ベストアンサー
    • HTML