title: Display Text Over Full Screen YouTube iframe
body: <p>How would you display text over a full screen YouTube iframe? Setting the <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=882225" rel="nofollow noreferrer">z-index to the maximum no longer works</a> in the new stable Chrome and other popular browsers.</p>
  
  <p><a href="https://jsfiddle.net/50vq8rw7/1/" rel="nofollow noreferrer">jsfiddle of what I'm trying to accomplish</a></p>
  
  <pre><code>&lt;div id="player"&gt;&lt;/div&gt;
  &lt;div id="overlay"&gt;Test&lt;/div&gt;
  
  #overlay {
      position:absolute;
      left:0;
      width:100%;
      height:12%;
      opacity:1;
      /*background:rgba(255,255,255,0.8); or just this*/
      z-index: 2147483647;
      color:#fff;
      bottom:0px;
      text-align:center;
      text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
      font-size:300%;
  }
  </code></pre>
  
  <p>Thank you very much in advance; I'm learning CSS/HTML and I can't figure this out!</p>