title: Send image in :before pseudo element behind of element
body: <p>I was inspired by <a href="http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/" rel="nofollow">Multiple Backgrounds with single element</a> and try to do that...but failed. </p>
  
  <p>This is my sample code in <a href="http://jsfiddle.net/Reiot/E8HAe/" rel="nofollow">jsfiddle</a>. </p>
  
  <p>Image(blue bird) in the :before element never goes down to main(white bird) element. Here goes what I tried with :before.</p>
  
  <ul>
  <li>content:url() or background:url()</li>
  <li>z-index: -1 or arbitrary smaller number than main's</li>
  <li>:before and :after :(</li>
  </ul>
  
  <p>How can I send it back to main element???</p>