title: Is it ever possible to render content *behind* its container's background?
body: <p>No amount of z-index trickery, etc., will ever allow the word "foo" here to be behind a background image on the <code>div</code>, correct?</p>
  
  <pre><code>&lt;div&gt;
    &lt;span&gt;foo&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Or, consider this:</p>
  
  <pre><code>&lt;div class="a"&gt;&lt;/div&gt;
  &lt;div class="b"&gt;
    &lt;span class="x"&gt;X&lt;/span&gt;
    &lt;span class="y"&gt;Y&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Is it possible for <code>.x</code> to render <em>behind</em> <code>.a</code> while <code>.y</code> renders <em>in front of</em> <code>.a</code>?</p>
  
  <p>I am not aware of any technique for doing so.</p>
  
  <p>Note: It’d b OK if this only worked in Webkit.</p>