How to make child z-index more than parent or any other way to achieve the effect? : <p><a href="https://i.stack.imgur.com/oq7q1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oq7q1.png" alt="a "></a></p>

<p>I'm trying to develop the following effect. 
Where parents are two sections like this and child is an image. How to achieve this without using absolute?</p>

<pre><code>&lt;section&gt;
  &lt;img /&gt;
&lt;/section
&lt;section&gt;
  ..more content
&lt;/section&gt;
</code></pre>

<p>But I got to know that child's z-index cannot be more than parent than whats the way round this?</p>
