title: Override parents z-index in child
body: <p>I have a part of DOM like this</p>
  
  <pre><code>&lt;div class="parent"&gt;
     &lt;a class="link"&gt;Link me &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS :</p>
  
  <pre><code>.parent {
     z-index: -2;
  }
  .link {
   z-index:9999;
  } 
  </code></pre>
  
  <p>I want a part of "parent" to wrap overlap/wrap under the previous div. So, I am using z-index -2. No matter what z-index I use for link, its not clickable. Any suggestions.</p>
  
  <p>PS: I cant use larger z-index for parent's predecessor div. Because "parent" has 3 siblings (columns) that do not need to go under the predecessor.</p>