How do you operate with google adsense responsive blocks on responsive website layout? Let's consider this simple case (written with bootstrap):
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-3">Menu</div>
<div class="col-sm-8 col-md-6">Content</div>
<div class="col-md-3 hidden-sm hidden-xs">Column with Adsense</div>
</div>
</div>
So we have 3 column layout for large screen and only two columns for small one. The right column is not very important so we just hide it, it includes adsense responsive block and we hide it as well.
If we open this page on small screen, we get an error TagError: adsbygoogle.push() error: No slot size for availableWidth=0
. How to avoid this?
Ideally I would like to reinitialize adsense blocks if window size changes (opened on small screen and then enlarged so that the third column becomes visible should trigger adsense initialization in appeared column), but I suppose it's not possible for now.
I tried to place adsense to fixed-size-container (that lives inside hidden-xs block), it does not work, the error appears anyway.
I also tried to add responsive class to the <ins class="adsbygoogle hidden-xs">...</ins>
but it also does not remove the error.