質問編集履歴

1 文追加

tqkqt0

tqkqt0 score 130

2017/11/29 17:36  投稿

ins文をdivに埋め込んではみ出る。
自分のはてなブログに広告を表示したくてアドセンスを使用しています。
その広告をDivで囲んでオシャレにしたいのですが、レスポンシブ広告がDivからはみ出たり、はみでなかったりします。
試行錯誤しましたが、私の感触では読み込むタイミングで再現しなかったりしたりするっぽいのですが、
何か解決策はありますでしょうか。
はてなブログの仕組み的にHTMLのすぐ後に書くことはできないのでJSで移動させています。
ご有識者の方よろしくお願いいたします。
 
```html
 
<style type="text/css">
 /*adsense*/
 div.gads {
   width: 99%;
   background-color: rgba(11, 13, 17, 0.6);
   border-radius:5px;
   margin-bottom:15px;
   text-align: center;
   color: rgba(166, 180, 183, 0.94);
   padding: 4px;
 }
</style>
<div id="entry-footer-secondary-modules">ここの後に表示したい</div>
<script>
   addEventListener("DOMContentLoaded", function() {
       var $target = $('#entry-footer-secondary-modules');
       $target.eq(0).after($('.foot-adsense'));
   }, false);
</script>
<div class="foot-adsense">
 <div class="gads">
   <span style="font-size: 85%;">Sponsored Link</span>
   <div><ins class="adsbygoogle"
             style="display:block; text-align:center;"
             data-ad-format="fluid"
             data-ad-layout="in-article"
             data-ad-client="ca-pub-xxxxxxxxxx"
             data-ad-slot="xxxxxxxxx"></ins>
     <script>
         (adsbygoogle = window.adsbygoogle || []).push({});
     </script>
   </div>
 </div>
</div>
```
  • HTML

    8970questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る