Menu
How do I prevent Adsense responsive unit placed similar to the code below from breaking out of the panel? In my experience the banner breaks the pannel and takes full width. The code used for Adsense responsive unit is the default code provided by Google.
<div class="col-md-12" style="padding-top:20px;">
<div class="panel panel-default panel-profile m-b-md">
<div class="panel-body text-center" style="padding: 5px 0 5px 0">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Thank You -->
<ins class="adsbygoogle"
style="display:block;"
data-ad-client="ca-pub-xxxxxx"
data-ad-slot="xxxxxx"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</div>
Your assistance is appreciated.
265
I have set up a Plunker test and to me everything looks ok: https://plnkr.co/edit/YTVHcR2SjMdEPyaM0Owa?p=preview
<!DOCTYPE html>
<html>
<head>
<link data-require="[email protected]" data-semver="3.3.7" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<script data-require="[email protected]" data-semver="2.2.4" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script data-require="[email protected]" data-semver="3.3.7" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
<script>
$(document).ready(function() {
(adsbygoogle = window.adsbygoogle || []).push({})
})
</script>
</head>
<body>
<h1>Hello Plunker!</h1>
<div class="col-md-12" style="padding-top:20px;">
<div class="panel panel-default panel-profile m-b-md">
<div class="panel-body text-center" style="padding: 5px 0 5px 0">
<!-- adsense responsive unit code -->
<ins class="adsbygoogle" data-ad-client="ca-pub-9482555242423991" data-ad-slot="1928867468" data-ad-format="auto"></ins>
</div>
</div>
</div>
</body>
</html>
CSS:
.adsbygoogle {
display: inline-block;
width:100%;
overflow: hidden;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
