html - How to make a link beneath a div clickable -

i have link under div 100% height , width in fixed position , z-index: 5. need keep div above link, link doesn't work. can make link work keep div above link?

https://jsfiddle.net/8hu90e9x/1/

div {    background:grey;    width:100%;    height:100%;    position:fixed;    top:0;    opacity:0.5;    z-index:5  }    {    font-size:50px;    z-index:0  }

<a href="http://google.com"> link</a>    <div></div>

you add pointer-events:none; css rules div

div {    background:grey;    width:100%;    height:100%;    position:fixed;    top:0;    opacity:0.5;    z-index:5;    pointer-events:none;  }    {    font-size:50px;    z-index:0;  }

<a href="http://google.com"> link</a>    <div></div>