Google AdSense Yellow Background Box (Change to White / Transparent / Blank)

On web pages that are added with Google AdSense ad codes, the background color of the ads appears as yellow (or another other color), instead of white or transparent (which will show the color of web page background).

The yellow blocks of Google AdSense ads normally appear before the ads actually loaded as the ads space is allocated once the web page is rendered. If you have just created a new ad and place its ad code on the web page, or are still waiting for approval to join Google AdSense, the yellow ad blocks are even more glaring. Supposedly Google AdSense would display ‘blank ad’ which shows nothing (i.e. empty with white background or transparent background) that blends with background color of the web page seamlessly.

To make matter worse, changing the color of the Google AdSense ads background does not fix the yellow box that appears.

The reason the yellow box appears on the Google AdSense ads space is likely due to custom CSS that changes the color of Google AdSense ads block. Google AdSense uses “ins” tag to inject ads through JavaScript. Some themes or templates have CSS (Cascading Style Sheets) that formats that “ins” tag, making it yellow. For example, the following CSS code will make Google AdSense ads have yellow background:

ins { background: #ffc; text-decoration: none; }

The CSS code can appears inline on the HTML of the web page, or import via external CSS, such as style.css in the case of WordPress. However, you no need to find the where exactly is that code that you need to change in the CSS, as CSS can be overridden.

To resolve the yellow box issue and revert the Google AdSense background back to white or transparent, add the following code just before the Google AdSense ad code:

For white background:

<style>
.adsbg { background: #fff; }
</style>

For transparent background:

<style>
.adsbg { background: transparent; }
</style>

Then, modify the following line of Google AdSense ad code to add in the CSS class:

Before:

<ins class="adsbygoogle"

After:

<ins class="adsbygoogle adsbg"

ins{background: #fff}