Internet explorer iframe hover propagation

问题

I noticed that in normal browsers when you haver over iframe all DOM elements above it get :hover pseudoclass - except in IE:

HTML:

<div class="outer">
<iframe src="" frameborder="0" class="inner" width="100" height="100"></iframe>
</div>

CSS:

.inner{
  background: #000;
}

.outer{
  outline: 2px solid red;
}

.outer:hover{
  outline: 2px solid blue;
}

http://codepen.io/anon/pen/vKJwbz

When you hover over the black square, the outline on the outer element should be blue. In IE it resets to red. Is there any way to get around it?

来源：https://stackoverflow.com/questions/38262353/internet-explorer-iframe-hover-propagation