• 締切済み

tdの背景をiframeが邪魔する

tdの背景として、両脇に縦のラインが出るようにしています。 そこにiframeで、他で書き込んだ内容が出るようにしたのですが、iframeが背景のラインを隠してしまうことがあります。右側の縦ラインが消えます。 (しかしなぜか、他の部分の書き方によって、出てきたり隠れたりします。) これを常に表示するには、どうしたらいいでしょうか。 この現象はIEのみで起こります。 その部分の書き込みは こんな感じです。 <td width="315" valign="top" background="base/info_back.gif"> <div class="title" style="border-left:6px solid #009966;height: 20px;"> INFORMATION</div> <center> <iframe src="info.html" scrolling="no" frameborder="0" height="180px" width="98%" allowtransparency="true"></iframe> </center> </td> また、設定したtdの幅できれいにiframe(右横のスクロールバーがtdの幅におさまり、下には表示したくない。)をはめ込むことができるでしょうか。 firefoxやOperaなどで表示幅が違ってしまうのはどうしようもないことでしょうか。

  • HTML
  • 回答数1
  • ありがとう数2

みんなの回答

noname#39970
noname#39970
回答No.1

borderの扱い方がIEとその他で異なるのが原因 どうしてもというなら「borderを含めた大きさ」に無理矢理納めるために希望サイズのdivで囲むしかない。 そのdivはtdより少しだけ小さい方が良い。 http://www.google.co.jp/search?hl=ja&lr=lang_ja&q=border%20ie%20%E9%81%95%E3%81%84

mutu560
質問者

お礼

お礼が遅くなりました。 なんとかあわせられました。 ありがとうございました。

関連するQ&A

  • Iframeとして呼び出すページを120px以下を表示したい

    Iframeを使いたいのですが、A.htmlの高さ120pixから下をIframeで指定したいときはどうしたらいいでしょうか。 <html> <head> <title>testtitle> </head> <body> <div width:100%; height:120px;> <table> <tr> <td><iframe src="A.htm" width="100%" height="100%" frameborder="0" scrolling="no" overflow:no></iframe><td> </tr> </table> </div> </body> </html> 呼び出すIframeの中身のページについて 高さを120pix以下を表示したいのですが。 よろしくおねがします。

  • テーブルの中にiframe

    テーブルの中にiframeをしているのですが どうしてもボタンが右側に少しはみ出ますし iframeは縦400pxを超えるページを表示すると 縦スクロールバーが表示されますが それも右側にはみ出ます。 どうにか800pxの中に収まらないものでしょうか? また、ボタンのボーダを下記ソースでは消していますが デフォルトで表示される立体感のあるボタンのまま 800pxの中に収めたいです。 HTML5、CSS2.1です。 ご相談お願いします。 <table> <tr style="width: 800px; height: 50px"> <td><input type="button" value="1"/></td> <td><input type="button" value="2"/></td> <td><input type="button" value="3"/></td> <td><input type="button" value="4"/></td> <td><input type="button" value="5"/></td> </tr> <tr style="width: 800px; height: 400px"> <td colspan="5" style="width: 800px; height: 400px"> <iframe src="hoge.htm"></iframe> </td> </tr> <tr style="width: 800px; height: 50px"> <td colspan="5" style="width: 800px; height: 50px"> <p>hoge</p> </td> </tr> </table> ------------------------------------------------------------ table { padding: 0px; margin: 0px; border-style: none; border-width: 0px; } tr td { padding: 0px; margin: 0px; border-style: none; border-width: 0px; } input { border-style: none; border-width: 0px; padding: 0px; margin: 0px; color: Red; width: 160px; height: 50px; font-size: 20px; font-family: HGS明朝B; background-color: transparent; } iframe { padding: 0px; margin: 0px; border-style: none; border-width: 0px; background-color: transparent; width: 800px; height: 400px; }

    • ベストアンサー
    • HTML
  • iframeの透過

    フレーム内の背景が透けて見えるようにpng画像を使用したのですがIEでは全く透過されません(firefoxではうまく透過されます) 出来ればIE6以上で透過できるようにしたいのですがどなたか分かる方みえないでしょうか? <td height="308" colspan="8" background="背景画像.jpg"><iframe src="フレーム画像.png" width="530" height="268" scrolling="yes" frameborder="0" style=" background-color:allowTrdansparency="true"></iframe></td>

  • <iframe>内にHTMLをランダム表示するには?続きです。

    先日の<iframe>内にHTMLをランダム表示するには?の続きなのですが、 http://questionbox.msn.co.jp/qa2962976.htmlの疑問は 皆様のお力で解決しました。 誠にありがとうございました。 もう一つ教えて頂きたいことがあるのですが、 かなりの素人なので説明不足など分かりづらいところが多々あると思いますが、 何卒宜しくお願い致します。 同じhtmlに複数のiframeを配置し、 各iframeをランダムにしたいのです。 その際、各iframeは別々のフォルダーに収納されているhtmlを 表示するようにしたいです。 例えば、同じhtmlに iframe1、iframe2、iframe3があるとし、 01、02、03という3つのフォルダーの中に 01.html、02.html、03.htmlがそれぞれ収納されているとした場合、 iframe1は01のフォルダーの中のhtmlをランダムで表示し、 iframe2は02のフォルダーの中のhtmlをランダムで、 iframe3は03のフォルダーの中のhtmlをランダムで、 といったランダム表示にしたいです。 あまりの素人なので全く分かりませんので、 大変申し訳ありませんが、 多少いじってコピペするくらいまで完成されたソースを教えて頂けますでしょうか? 宜しくお願い致します。 ------------------------------------------------------------------------- 以下のソースは、 3つのiframeに同じフォルダー内のhtmlをランダムで表示させることができたソースです。 教えてもらいました。 こちらは参考までに載せました。_ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title></title> <script type="text/javascript"> <!-- function RndmSubFlame(){ rlURL= new Array(); rlURL[0]="01.html" rlURL[1]="02.html" rlURL[2]="03.html" n=rlURL.length; x1=Math.floor(Math.random()*n); x2=Math.floor(Math.random()*n); x3=Math.floor(Math.random()*n); s01.location.href = rlURL[x1]; s02.location.href = rlURL[x2]; s03.location.href = rlURL[x3]; } //--> </script> </head> <body onload="RndmSubFlame()"> <table border="1" width="84%" height="87"> <tr> <td width="33%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="s01" scrolling="no"></iframe></td> <td width="33%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="s02" scrolling="no"></iframe></td> <td width="34%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="s03" scrolling="no"></iframe></td> </tr> </table> </body> </html> ------------------------------------------------------------------------- 以下のhtmlソースに書き加えてもらえると大変助かります。 何卒、宜しくお願い致します。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title></title> </head> <body> <table border="1" width="45%" height="448"> <tr> <td width="46%" height="210"><iframe src="01/01.html" frameborder="0" width="100%" height="190" name="01" scrolling="no"></iframe></td> <td width="54%" height="442" rowspan="2"><iframe src="03/01.html" frameborder="0" width="100%" height="190" name="03" scrolling="no"></iframe></td> </tr> <tr> <td width="46%" height="226"><iframe src="02/01.html" frameborder="0" width="100%" height="190" name="02" scrolling="no"></iframe></td> </tr> </table> </body> </html>

  • iframeが正しく表示されません

    #box1{ width: 595px; float: left; height: 570px; margin-top: 70px; margin-left: 10px; border: 1px solid #000000; } <div id="box1"> <iframe src="http://astore.amazon.co.jp/uraren-22" width="100%" height="100%" frameborder="0"></iframe> </div> とゆう表記でHPを作成したのですが、IEではちゃんと表示されるのですがfirefoxやsafariですと、box1の中に表示されず下にずれ、スクロールバーが表示されなかったりもします。 解決方法をお願いします。

    • ベストアンサー
    • HTML
  • CSSを使ってのiframe

    xhtmlとcssでhpを作ってます。 iframeをcssで表現したいんですが、どうしてもフレーム枠に1pxほどの枠が出てしまいますので、それを無くしたいのと、スクロールバーが出ないようにしたいのですが、どのような書き方がベストでしょうか? どなたかアドバイスをお願いします。 現状では以下の書き方をしております。 -----css----- #top{ float:left; text-align:left; width:300px; } #top_iframe{ overflow:auto; width:300px; height:150px;} -----html----- <div id="top"> <iframe src="xxx.html" title="top">更新</iframe> </div> 希望としては現状の幅300px 高さ150pxで、枠が無くスクロールバーもでないようにしたいのですが・・・ <<当方初心者なので、お返事頂けるさいにはcssとhtmlのタグでご回答願います。>>

    • ベストアンサー
    • HTML
  • <iframe>内にHTMLをランダム表示するには?

    かなりの素人なので説明不足などで分かりづらいところが多々あると思いますが、 何卒宜しくお願い致します。 同じhtmlに複数のiframeがあるのですが、 その全てのiframeをランダムにしたいのですが、 あまりの素人なので全く分かりません。 申し訳ありませんが、 多少いじってコピペするくらいまでのソースを教えて頂けますでしょうか? 宜しくお願い致します。 iframe一つだけのランダムは以下のソースでできました。 <head> <script type="text/javascript"> <!-- function RndmSubFlame(){ rlURL= new Array(); rlURL[0]="01.html" rlURL[1]="02.html" rlURL[2]="03.html" n=rlURL.length; x=Math.floor(Math.random()*n); sub_flame.location.href = rlURL[x]; } //--> </script> </head> <body TopMargin=0 LeftMargin=0 RightMargin=0 BottomMargin=0 STYLE="overflow:auto;height:100%;" onLoad="RndmOpen()"> <script><!-- document.write("<iframe src=\""+riURL[x]+"\"></iframe>"); //--> </body> 以下のhtmlのようなページです。 できましたら、このソースに書き加え頂けますと 大変助かります。 宜しくお願い致します。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title></title> </head> <body> <table border="1" width="84%" height="87"> <tr> <td width="33%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="01" scrolling="no"></iframe></td> <td width="33%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="02" scrolling="no"></iframe></td> <td width="34%" height="81"><iframe src="a01.html" frameborder="0" width="100%" height="190" name="03" scrolling="no"></iframe></td> </tr> </table> </body> </html>

  • IE borderの下まで背景 paddingの下まで背景

    以下のhtmlを参照してください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>背景</title> <style> div {background-color:#CCCCFF;border:dashed 1px #FFCCCC;} </style> </head> <body style="margin:0px;"> @IE7での話です。 背景がborderの下まで表示されるかどうか。 <br> <div>指定無しMM同字口()□</div><br> <div style="width:100%;">width:100%;MM同字口()□</div><br> <div style="width:500px;">width:500px;MM同字口()□</div><br> <div style="height:18px;">height:18px;MM同字口()□</div><br> <div style="line-height:18px;">line-height:18px;</div><br> <div style="height:20px;">height:20px;MM同字口()□</div><br> <div style="line-height:20px;">line-height:20px;</div><br> 高さや幅を指定するとpaddingの下<br> 指定無しならborderの下<br> 指定有りでborderの下まで表示させるにはどうすればいいのでしょうか。line-heightだと1行にしか対応できませんし、幅も指定できません。 </body> </html>

  • Netscape7.1 での表示方法を教えてください。

    初めまして。 現在ホームページを作成中なのですが、以下のソースでページを表示しようとすると、 Netscape7.1だけ正しく表示されません。素人考えなのですがNetscapeではテーブル タグのheight="%"が無視されているように思えます。Netscapeで正しく表示される方 法をお教え下さると幸いです。よろしくお願い致します。 <html> <head> </head> <body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div style="text-align:center"> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="margin:auto;text-align:left"> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> <tr> <td align="left" valign="top"> <iframe name="contents" src="a.html" width="100%" height="100%" style="border:solid 0pt;border-color:#000000;" scrolling="no" frameborder="0" allowtransparency="true"></iframe></td> </tr> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> </table> </div> </body> </html>

    • ベストアンサー
    • HTML
  • ホームページを作っています、ページ内にiframeで他のページを表示さ

    ホームページを作っています、ページ内にiframeで他のページを表示させています。 IEではこのiframeにスクロールバーが出て、縦に長いデータをスクロールして閲覧あせる事が できるのですが、Firefoxだとスクロールバーが出ません・・・ どなたか表示させる方法をご存知でしたら教えてください。 以下HTML記述 <iframe name="iframe4" id="iframe4" frameborder="0" scrolling="yes" src="topix.html" title="※※">※※</iframe> CSS記述 #iframe4{ border-width : 0px 0px 0px 0px; margin-left : 0px; width : 420px; height : 490px; padding-top : 0px; overflow : hidden; margin-top : 0px; margin-right : 0px; margin-bottom : 0px; padding-bottom : 0px; }

    • ベストアンサー
    • HTML

専門家に質問してみよう