【问题标题】：How do I avoid CLS (cumulative layout shift) with Google Adsense "Let Google optimize the size of your mobile ads" enabled?如何在启用 Google Adsense“让 Google 优化您的移动广告尺寸”的情况下避免 CLS（累积布局转换）？
【发布时间】：2021-07-12 04:16:16
【问题描述】：
我没有使用自适应广告，因为我希望获得更高的 Web Vitals 分数。
但是，在选中 Let Google optimize the size of your mobile ads 后，Google 似乎仍会通过将 CSS 属性修改为以下内容来更改/更新其在 min-height 定义的容器中的广告尺寸：
height: auto !important;
min-height: 0px !important;
有什么办法可以解决吗？
我不想取消选中它，因为收入会下降。
【问题讨论】：
标签：
core-web-vitals
web-vitals
cumulative-layout-shift
【解决方案1】：
以下是关于如何使用 Google Adsense 减少 CLS 的一些很好的参考资料（ref1 和 ref2）：
最好的方法是为每个广告单元的包装器添加一个最小高度值。然而，使用一个类来定位这个 CSS 属性是不够的——你需要使用一个 ID 来定位这个包装器。出于某种未知原因，Google AdSense 的 Javascript 去除了所有父对象的最小高度指令。
但是，如果您使用 ID 进行 CSS 定位，它们不会删除这一点。
所以诀窍是添加一个id 来定位容器的 CSS，这应该会将您的 CLS 降低到 0！