css, clicking on something under a div

StackOverflow https://stackoverflow.com/questions/11552546

  •  21-06-2021
  •  | 
  •  

Question

Alright, so I have some code, and I'd like to be able to click things under the div on top. For some reason, it isn't working, and I have no idea why. After extensive googling, I'm pretty sure I'm using pointer-events correctly, so if anyone could provide some insight into my problem, a million hugs.

    <html>
<head>
<style type="text/css">
#profilecontainer{
position:absolute;
top:0;
}
#topdiv{
background-image:url('http://img805.imageshack.us/img805/7227/profilek.png');
width:621;
height:365;
z-index:3!important;
pointer-events:none;
}
#content{
height:75;
width:571;
position:absolute;
clip:shape;
top:270;
left:25;
z-index:-2;
pointer-events:auto;
}
</style>
</head>
<div id="profilecontainer"><div id="content" class=""><a href=http://www.youtube.com/watch?v=9LlYs_s1494>Test clicker</a></div><div id="topdiv"></div></div>
</body>
</html>
Was it helpful?

Solution

Add &nbsp; to topDiv because it isn't displayed otherwise.

Then add position: absolute; to topDiv's CSS and it should work fine.

Relevant information on this:

Click through a DIV to underlying elements

Don't forget to use the IE workaround.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top