After adding the Google AdSense code to my website on one page, I noticed that the entire layout (including the top navigation, etc.) shifted slightly to the left. This shift is especially noticeable when transitioning from a page without the ad to one with the ad.
I am struggling to identify the cause of this issue and find a solution to fix it.
Here is the code snippet:
HTML:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Botlane.net -->
<ins class="adsbygoogle"
data-ad-client="ca-pub-XXXXXXXXXX"
data-ad-slot="XXXXXXXX"></ins>
<script>
CSS:
.adsbygoogle {
display:block;
width:728px;
height:90px;
margin: auto;
}
(Originally, the CSS property was set to display:inline-block, but changing it to display:block did not resolve the issue)
Any help or suggestions would be greatly appreciated.
EDIT: I have included two screenshots of the header - one with the ad displayed and one without. A comparison between the two images clearly shows the shift to the left.