title: Responsive Ad Label around adsense
body: <p>I'm trying to have my site on the whitelist for AdBlock. In order to do so, I need to encapsulate all my advertisement with a label. I was able to add the label but it's not responsive and sometimes the ad will overlap. May I ask what's a better way to create a label around adsense advertisement.</p>
  
  <pre><code>&lt;div style="position: relative;"&gt;
      &lt;span class="Ad-label"&gt;Advertisement&lt;/span&gt;
      &lt;section&gt;
          &lt;div class="row"&gt;
              &lt;div class="row-sm-height"&gt;
                  &lt;script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"&gt;&lt;/script&gt;
                  &lt;!-- Responsive Banner Ad --&gt;
                  &lt;ins class="adsbygoogle"
                       style="display: block"
                       data-ad-client="ca-pub-2315506723267173"
                       data-ad-slot="5172135644"
                       data-ad-format="auto"&gt;
                  &lt;/ins&gt;
                  &lt;script&gt;
                      (adsbygoogle = window.adsbygoogle || []).push({});
                  &lt;/script&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  
  .Ad-label {
      color: #444;
      background: #ddd;
      font-family: arial;
      padding: 3px 10px;
      font-size: 10px;
      -webkit-transform: rotate(90deg);
      -webkit-transform-origin: left top;
      -moz-transform: rotate(90deg);
      -moz-transform-origin: left top;
      -ms-transform: rotate(90deg);
      -ms-transform-origin: left top;
      -o-transform: rotate(90deg);
      -o-transform-origin: left top;
      transform: rotate(90deg);
      transform-origin: left top;
      position: absolute;
      left: 13%;
      top: 0px;
      white-space: nowrap;
      font-size: 11px;
      display: inline-block;
  }
  
  [1] 
  </code></pre>