CODEWITHSUNDEEP
htmlcssadsense
Jakob Nielsen
Jakob Nielsen

Reputation: 5198

Google Adsense moves whole page to the left

I added the google adsense code into my website on one page, what I noticed is that the whole page (inclusive Top navigation ec.) was shifted a little bit to the left after I added the code.

You especially notice this when you go from an page without the ad to the one with the ad.

So my problem is that I have no idea what could be the cause of this problem, neither do I know how to fix it.

Here the code:

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 it was display:inline-block, but the change to display:block didn`t cause the problem, I tested this already)

Thanks for any help in advance

Edit: Here are two screenshots of the Header, one while on the page with the ad, one while on a page without the ad. If you will compare them, you will notice a shift to left

Header without Ad

Header with Ad

Upvotes: 0

Views: 212

Answers (2)

Jackson
Jackson

Reputation: 3518

The position shift is caused by the scroll bar appearing on the side. It is normal browser behaviour when the page becomes too long to fit in the window. You could add this to the body css to display the scroll bar all the time perhaps:

body {
   overflow-y: scroll;
}

Upvotes: 1

meadowstream
meadowstream

Reputation: 4141

It's the scrollbar that is added. You can force the scrollbar with css:

html {
       overflow-y: scroll;
}

Upvotes: 0

Related Questions