• ベストアンサー

広告部分にCSSが利かない

「忍者TOOLS」というところでサーバーをレンタルしているのですが、 急に、広告の部分にCSSが利かなくなってしまいました。 CSSが利いていた以前は、広告の部分が下記のようになっていましたが、 <div style="margin:30px 0 0 0;width:100%;overflow:hidden;">~</div> それが、今ではこのようになっています。 <iframe allowTransparency="true" src="/_yai_nobita/index.html" width="100%" height="15" FRAMEBORDER="0" SCROLLING=no style="margin:30px 0 0 0;"> <a href="http://www.shinobi.jp/">[NINJA] Free Web Hosting </a> </iframe> FAQにて、『身に覚えの無いフォルダ「_yai_nobita」があるのですが』という質問に対し、 『「_yai_nobita」というフォルダは、広告を上手く表示させるためのプログラムです。 サイト作成自体には何ら支障がありませんのでご安心下さい。』 という回答がなされていましたが、それだけでは、CSSの利かない理由は分かりませんでした。 「忍者TOOLS」に問い合わせるのも良いと思いましたが、 こちらでご存知の方がいらっしゃるかも知れないので、質問させていただきました。 よろしくお願いいたします。

noname#10669
noname#10669
  • HTML
  • 回答数2
  • ありがとう数3

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

  • ベストアンサー
  • twk
  • ベストアンサー率29% (18/62)
回答No.2

広告を表示させる方法が変わったようですね。 iframeの中身のmarginなどをiframeタグのstyleで制御することはできませんので、可能ならば/_yai_nobita/index.html を編集すると良いかと思います。ただ、忍者TOOLSがそのファイルの編集を禁止しているかもしれませんが。

noname#10669
質問者

お礼

ご回答ありがとうございます。 私もそれが可能なのではと思い、ディレクトリとファイルを作ってアップロードを試みましたが、やはり忍者TOOLS側で規制されているらいしく、上手くいきませんでした。

その他の回答 (1)

回答No.1

iframeっていうのは、フレームってことですよね。 あなたのHTMLファイルに、広告用のHTMLが別に埋め込まれて表示されているような状況になっているのだと思います。 やいのびた、っていうやつと、あなたが適用しているCSSとの関連づけはできませんから、CSSの適用がなされないのだと思います。 忍者TOOLSがどういうサイトか知りませんが、勝手にHTMLファイルの下部に埋め込まれたのであれば、手が出ないと思います。 予想ですが、テキスト広告に手を加えられることを防ぐ為に、忍者ツール側が、こういう形式にしたのではないでしょうかね。

noname#10669
質問者

お礼

ご回答ありがとうございます。 うーん、きちんと規約を守って広告を表示させているユーザーには、何とも迷惑なことですね。レンタルする際の謳い文句に「CSSに対応しているため、デザインの邪魔になりません!」とあるだけに、何だか騙された感が否めません(^_^;)

関連するQ&A

  • CSSでインラインフレームを非表示にしたい

    初心者です。 いろいろ試したのですがうまくいかないので教えてください。 複数のインラインフレームのレイアウトを、スタイルシートで一括管理したいのですが、 たとえば、 <iframe class="free" src="http://www.***" scrolling="no" frameborder="no"></iframe> <iframe class="only" src="http://www.***" scrolling="no" frameborder="no"></iframe> <iframe class="link" src="http://www.***" scrolling="no" frameborder="no"></iframe> と縦に並んでいるインラインフレームをhtmlは変更せずに、 真ん中の「only」だけ隠すことはできませんか? スペースが空かずにfreeとlinkだけが並んでいる状態にしたいです。 宜しくお願いします。 .free { width:450; height:760; border:none; margin: 0px; overflow: hidden; } .only { width:450; height:680; border:none; margin: 0px; overflow: hidden; } .link { width:450; height:680; border:none; margin: 0px; overflow: hidden; }

    • ベストアンサー
    • CSS
  • cssとjquery

    WEBデザインド素人です。 とんちんかんな質問だったらごめんなさい。 単刀直入に質問させていただきます。 div#likebox_container .fbcomments, div#likebox_container .fb_iframe_widget, div#likebox_container .fb_iframe_widget[style], div#likebox_container .fb_iframe_widget iframe[style], div#likebox_container .fbcomments iframe[style], div#likebox_container .fb_iframe_widget span{  width: 100% !important; } 以上のように一括設定したスタイルを、jquery にて、状況に応じて width の設定を替えられないものだろうか、、、と悪戦苦闘中でございます。 ピンと来た方もいらっしゃるかもしれませんが、とあるHTMLページに、自分のfacebookのタイムラインと『いいね!』を配置し、その横幅をレスポンシブにしようとした場合の設定方法(有名?)とのことでした。 確かに、上記スタイルを追加すると、気持ちいいくらい横幅がレスポンシブになってくれますが、ただ1点だけ気になることがあり、iphone5(width=320px)で表示した場合のみ、右側に変な余白が出来てしまいます。 (横幅が320px以上のandroidだと大丈夫とのことで、どうやらタイムライン表示部の横幅が292pxで、加えて両サイドのpadding?margin?が邪魔してズレテしまう、、、みたいです。 それはさておき、、、) これを何とかしようと、2日ググってみましたが解決せず、じゃ最後の砦のjqueryで何とかしたいなと、そこでも色々調べてみましたが、上手く行かず、でした。 width: 100% !important の部分を、iphone 判定の場合のみ width: 320px に変更できないのでしょうか? $("div#likebox_container .fbcomments").css("width","320px"); $("div#likebox_container .fb_iframe_widget").css("width","320px"); $("div#likebox_container .fb_iframe_widget[style]").css("width","320px"); $("div#likebox_container .fb_iframe_widget iframe[style]").css("width","320px"); $("div#likebox_container .fbcomments iframe[style]").css("width","320px"); $("div#likebox_container .fb_iframe_widget span").css("width","320px"); と動かしてみましたが、どうも上手く行きませんでした。というより無反応。。。 query にこだわってるわけではありませんが、そのCSSスクリプト内の数値をパラメータ化して可変にできるのなら、それでも良いのですが、、、聞いたことないので、どうしたものかと考えております。 何か妙案お持ちの方、あるいは小生の愚問を一蹴・叱責して頂ける方いらっしゃいましたら、ご教示頂けると幸いです。 よろしくお願いいたします。 ※ 上記ソース内のブランク部には、分かりやすいようにと、全角スペースを使用しております。

    • ベストアンサー
    • CSS
  • アイフレームについて

    現在HP作成中です。 画像を作成し、その上にアイフレを載せました。 そのページをtopにしたいのですが アイフレ画像が左上のままセンタリングできません。 検索してみたのですが、できませんでした。 画像をセンタリングしてページの真ん中に寄せるには どうしたらよいのでしょうか? 以下、タグです。 <div style="background:url(img/top.gif);width:520px;height:350px;text-align:center;"> <iframe src="menu.html" name="menu" style="margin-left:180px; margin-top:71px; border:1px solid white;" frameborder="0" width="296" height="178" scrolling="yes" allowtransparency="true"> <p>インラインフレームを使用しています。見るにはインラインフレームをサポートしているブラウザが必要です。</p></iframe> </div>

    • ベストアンサー
    • HTML
  • CSSが反映されなくて困っています。

    iframeを使ってhtmlファイルのdiv要素を表示しようとしていますが表示すると iframeの左端に意図しないスペースができてしまい困っています。 "IEの要素を検証"でデバッグしながら検証しているのですが、 レイアウトを見るとOffsetが60となっています。 "IEの要素を検証"を使いdiv要素のスタイルを指定しているwidthを変更すると IE上でスペースが小さくなっていくのが確認できるので、 その通りにCSSファイルの中身を書き換えるのですが、 何故か反映されず困っています。 ブラウザのキャッシュはクリアしています。 div要素のクラス以外で考えてみる必要のある項目が有るのかとも思うのですが、 何かアドバイス頂けませんでしょうか? 下記ソースです。 HTML(覗く側)-------------------------------------------------------------------- <IFRAME src="xxx/index.html" name="Topページメイン画像" width="900px" height="550px" frameborder="0" scrolling="no"> ブラウザがインラインフレームに対応していません。 表示される文章はこちらです。 </IFRAME> HTML(index.html)覗かれる側---------------------------------------------------------- <div class="fallback-message"> <img src="top2.jpg" width="900px"></img> </div> ---------------------------------------------------------------------------------- CSS------------------------------------------------------------------------------ .fallback-message { width: 818px; line-height: 0; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; font-family: sans-serif; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; border-top-color: #e4c652; border-right-color: #e4c652; border-bottom-color: #e4c652; border-left-color: #e4c652; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; background-image: none; background-attachment: scroll; background-repeat: repeat; background-position-x: 0%; background-position-y: 0%; background-color: rgb(238, 220, 148); } ---------------------------------------------------------------------------------- 何卒お願いいたします。

    • 締切済み
    • CSS
  • 指定したborderの一部が表示されない

    以下のようにboxを作りその中にフロートさせた2つ(div class="b"とdiv id="c"を作り、 div class="b"の方にdiv class="nwesbox"を作り、その中にiframeを入れました。 問題はdiv class="nwesbox"に上下左右に表示指定したborderの線の右側のみブラウザ(ie7)で表示されません? div id="c"を取り除くと表示されます、nwesboxやiframeの幅を変更したりしてみましたが 解決できなく困っています、どなたか教えていただけますでしょうか? 宜しくお願いします。 以下html記述-----↓ <div class="box"> <div class="b"> <div class="nwesbox"><iframe id="iframe" frameborder="0" scrolling="yes" src="whats.html" title="お知らせ">お知らせ</iframe></div> </div> <div id="c"> <p>*****</p> </div> 以下CSS記述------↓ .box{ width : 898px; margin-left : 0px; margin-top : 0px; padding-left : 0px; margin-bottom : 0px; } .b{ width : 575px; margin-left : 0px; margin-top : 10px; background-color : #ffffff; padding-left : 10px; float : left; margin-right : 0px; } .nwesbox{ width : 575px; height : 233px; background-color : #ffffff; border-width : 1px 1px 1px 1px;border-style : solid solid solid solid;border-color : #0080ff #0080ff #0080ff #0080ff; } #iframe{ border-width : 0px 0px 0px 0px; margin-left : 0px; width : 573px; height : 228px; padding-top : 0px; overflow : auto; margin-top : 0px; } ↓---iframe内に読み出してる先のテーブルに指定した内容(テーブル幅)--- #what{ width : 545px; background-color : #ffffff; margin-top : 0px; }

  • 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などで表示幅が違ってしまうのはどうしようもないことでしょうか。

  • CSSのフッター部分について

    CSS初心者です 今回外部CSSで作成したのですが途中まではうまくいきました しかし最後のフッターを入れるとレイアウトが崩れるのです。 今回の形状はページに上から「ページ(ホームページタイトル)」「ヘッダー(サブタイトル)」「同域上に左右に分けて「submanu」「main」」として最後にfootで「コピーライトなどを書いて」閉めたいのです 作ったCSSは以下の通り(どこが悪いのでしょう(foot入れるまで理想に近づいていたのですが)) *{ margin: 0px; padding: 0px; } div#page { text-align: left; border: 1px solid #333333; background: #66FFFF; width: 720px; margin: 0px; } div#head { width: 720px; padding: 5px 5px 0px 0px; margin: 0px; background: #FF00FF; } div#main { margin: 0px; border-left: 1px solid #FF; padding: 20px 0px; background: #00CCFF; width: 560px; height: 5000px; float: left; } div#submenu { width: 160px; height: 5000px; margin: 0px; padding: 20px 0px; float: left; background: #00FF33; } div#foot{ clear:both; text-align:center; font-size:10px; background:#FFFFFF; width:720px; height:20px; }

    • 締切済み
    • CSS
  • インラインフレームの縦幅を、ブラウザ・画面・解像度に合わせて、自動的に調節させたいけど、IEとOperaで上手くいきません;;

    現在ホームページを制作中で、初めてインラインフレームを使って制作しています。 まず下記のように、インラインフレームのみで試してみたら、IE7・Opera・FireFox・GoogleChromeで上手く自動的に調節できました。 <html> <head> </head> <body> <div> <iframe src="frame_test.html" allowtransparency="true" frameborder="0" width="600" height="80%"></iframe> </div> </body> </html> 次に、インラインフレームの周りに、下記のように画像やリンクバナーなどを配置させました。 <html> <head> </head> <body> <div><img src="" width="50" height="600"></div> <div><img src="" width="150" height="600"></div> <div> <iframe src="frame_test.html" allowtransparency="true" frameborder="0" width="600" height="80%"></iframe> </div> </body> </html> これも予定通り、IE7・Opera・FireFox・GoogleChromeで上手く自動的に調節できました。 次に、下記のようにそれぞれをフロートさせて配置させてみました。 <html> <head> </head> <body> <div style="float:left;"><img src="" width="50" height="600"></div> <div style="float:left;"><img src="" width="150" height="600"></div> <div style="float:left;"> <iframe src="frame_test.html" allowtransparency="true" frameborder="0" width="600" height="80%"></iframe> </div> </body> </html> すると、FireFox・GoogleChromeでは上手くいったのですが、IE7・Operaでインラインフレームの縦幅が100pxくらいに短くなってしまい、調節もできなくなってしまいました。 それぞれを配置させるのにフロートは必要なので、どうすればよいか分からなくて困っています。 何が原因で、どうすれば上手くいくか分かる方、どうかアドバイスをお願いします。

  • css 画像の一部分をリンクにしたいです

    画像の一部分だけをリンクにしたいです。 margin と width と height で指定したエリアをマウスオーバーすると、指定した部分だけ画像が変わってリンクになるという動作をさせたいのですが、うまくいきません。 最悪、画像が変わらなくても指定した部分のリンクができれば良いのですが画像全体がリンクになっているため、全体画像の上でマウスを動かしていると、リンク時のマウスカーソルになったり通常時のマウスカーソルになったりを繰り返しています。 html と css は以下のような記述をしています。 <html> <head> <style type="text/css"> div#menu a:hover { display:block; background-image:url(img/headerimg02.jpg); background-repeat:no-repeat; margin: 50px 468px 250px 50px; width:200px; height:100px; text-align:center; text-indent: -2000px; overflow: hidden; } </style> </head> <body> <div id="menu"> <a href="hoge.html"><img src="img/headerimg01.jpg" width="718" height="400"></a> </div> </body> </html>

    • ベストアンサー
    • CSS
  • ホームページを作っています、ページ内に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

専門家に質問してみよう