title: How to overlap a div over a div in tailwind-css
body: <p>I have a navbar on my site, when the site is on mobile size I want to have my hamburger menu overlap the contents of my page.</p>
  <p>This is my site :</p>
   
  <pre><code>&lt;!-- logo Start --&gt;
  &lt;div class=&quot;nav-logo&quot;&gt;
    &lt;h1&gt;My site&lt;/h1&gt;
  &lt;/div&gt;
  
  &lt;!-- links Start --&gt;
  &lt;div
    class=
      &quot;
      w-full
      flex
      flex-col
      items-center
      text-5xl
      md:pr-20
      &quot;
  
  &gt;
    &lt;a href=&quot;#&quot;
       class=&quot;block md:inline-block&quot;&gt;Work&lt;/a&gt;
    &lt;a href=&quot;#&quot;
       class=&quot;block md:inline-block&quot;&gt;About&lt;/a&gt;
    &lt;a href=&quot;#&quot;
       class=&quot;block md:inline-block&quot;&gt;Contact&lt;/a&gt;
  &lt;div/&gt;
  
      &lt;!-- links End --&gt;
  
    &lt;/nav&gt;
  
      &lt;main&gt;
      &lt;article&gt;
       &lt;h1&gt;Hello&lt;h1/&gt;
      &lt;/article&gt;
      &lt;main/&gt;
  </code></pre>
  <p>I tried adding <code>relative</code> and <code>z-10</code> both on my <code>nav-links</code> and <code>nav</code> but they dont work, they still push the content downwards instead of having that div overlap.</p>
  <p>Any suggestions on what to do?</p>