.ad-slot { width: 100%; max-width: 300px; }
.ad-slot iframe { width: 100% !important; }

320 像素宽的安卓机上,300 宽的广告位加上左右各 12 像素内边距,页面能向左拖出 4 像素白边。这类现象通常不是突然出现的,往前翻半天日志能看到苗头。

追下去是这么回事:广告容器写死了 300 像素宽,没有 max-width 限制。广告联盟的 iframe 又带固定宽度,父级一窄就顶出去。

围绕「广告位溢出」排查时,命令行跑一遍比在面板里点十次有用,面板会替你做掉不少隐式操作。监控和日志的时间要对上,时区不一致会多绕很大一圈。

临时改动用注释写上日期和原因,过两周自己都记不清为什么这么写。动手前把原文件复制一份带时间戳,出问题立刻换回去,比现场分析快得多。

处理上按这个顺序:容器改成宽度百分之百,再用 max-width 限制上限;iframe 宽度设成百分之百,高度按比例留;给 body 加 overflow-x 只是遮住问题,还得回头查谁超宽;在 320、375、414 三个宽度各看一次。

确认没问题再收工,三种屏宽下都拖不出横向滚动,广告右边距和正文对齐。

作者 9823189