asynchronous - 响应式设计和 Google Adsense - 无法让它发挥作用

Question

我正在尝试使用 Google Adsense 上的新响应式广告单元将我网站上的静态广告更改为响应式广告

我被卡住了，这是我的代码:

HTML:

<div class="g-ad">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Responsive-Forum-Bot -->
<ins class="adsbygoogle g-ad-in"
     style="display:inline-block"
     data-ad-client="ca-pub-client"
     data-ad-slot="adnumber"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>

CSS:

@media (min-width:500px){
    .g-ad, .g-ad-in{
        width:468px
    }

    .g-ad-in{
        height:60px
    }
}

@media (min-width:800px){
    .g-ad, .g-ad-in{
        width:728px
    }

    .g-ad-in{
        height:90px
    }
}

我的问题是容器改变了宽度，但它自己的广告没有。
难道我做错了什么？我使用了顶部的指南并遵循了它。

提前致谢，
叮。

Answer 1

两件事情:
1) 您需要为 css 类“g-ad”指定高度，因为容器 div 具有该类。
2) AdSense 响应式广告不是 100% 响应式:广告在调整窗口大小时不会适应其容器，在调整窗口大小后，您必须刷新页面才能看到新尺寸的广告。

当页面加载时，Google 会根据广告容器的宽度和高度调整广告，当然我们(开发人员)对此并不“太高兴”，我在 AdSense 博客上读到他们计划解决这个问题。