title: iframe with pointer-events: none; but with a div inside it that has pointer-events: auto;
body: <p>It is possible to have an outer div with pointer-events: none; and another div inside it with pointer-events: auto;. The outer div will be transparent to click events (ie it won't react to click events but underlying html controls will) and the inner one will. </p>
  
  <p>However, I now have a scenario where I need to do the same thing with an iframe, but it is not working. I set pointer-events: none; on the iframe, but then the inner divs that should be clickable are not even if they have pointer-events: auto; set.</p>
  
  <p><a href="https://stackoverflow.com/questions/23329991/make-an-iframe-have-pointer-events-none-but-not-on-a-div-inside-that">There is another similar question here</a>, but is has been closed for being off-topic. I don't understand why. It is a very valid html/css question.</p>