Links not working in an absolute container with a positive z-index
<p>The problem can be seen on the website I am developing <a href="https://manu354.github.io/portfolio/" rel="nofollow noreferrer">https://manu354.github.io/portfolio/</a></p>

<p>The links in the header cannot be clicked. After a quick search on SO I realized this was because my div was positioned absolute. I had positioned it absolute, so it didn't take up any space in my page layout. To fix this, multiple answers said to add a <code>z-index : 10;</code> to my div. This let me click the links (Pointer / hover functionality worked) and completely fixed the problems for my external links to Facebook, or Twitter. However my internal functional links e.g <code>href="#welcome"</code>were clickable, however they didn't move to the area they were meant to (works if the div is positioned relatively).</p>

<p>For example (the actual codes much longer, and uses revolution slider)</p>

<pre><code>&lt;div style="position:absolute; z-index:1;"&gt;

&lt;a href="#welcome" target="_self" style="z-index: 10;&gt;

&lt;/div&gt;
</code></pre>

<p>Anybody know a fix for this? </p>

<p>Thanks</p>