title: Pointer Events on IE 10
body: <p>IE 10 does <a href="https://stackoverflow.com/questions/16396796/rule-for-ie-not-working-in-ie-10">not support conditionals</a> and we all know that, so regular targeting rules for unsupported css properties arn't an option here. An image to see how IE 10 thinks he is not IE: </p>
  
  <p><img src="https://i.stack.imgur.com/35Pu8.jpg" alt="enter image description here"></p>
  
  <p>All right, but there are a thing called <code>pointer-events</code> that are taking more time to solve than it should. I tried <a href="https://stackoverflow.com/questions/5855135/css-pointer-events-property-alternative-for-ie">this solution</a> but no hope in my case. I've a text that is set on top of a deformed <code>div</code> button. I applied the <code>pointer-events:none;</code> to this <code>div</code> text. </p>
  
  <pre><code>&lt;div class="btn-text-facebook "&gt;Facebook&lt;/div&gt;
  &lt;a class="btn-facebook " href="#"&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>And the CSS:</p>
  
  <pre><code>.btn-facebook{
  float: left;
  background-color: #3B5998;
  height: 100%;
  padding: 10px;
  width: 110px;
  transform:skewX(-40deg);
  -webkit-transform: skewX(-40deg);
  z-index: 1;
  -webkit-border-top-left-radius: 15px;
  -webkit-border-bottom-left-radius: 15px;
  -moz-border-radius-topleft: 15px;
  -moz-border-radius-bottomleft: 15px;
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px;
  box-shadow:  inset 0px -1px 1px #999,
              0px 1px 5px 0px rgb(17,17,17);           
      }
  
  .btn-text-facebook{
  position: fixed;
  top: 17px;
  right: 230px;
  z-index: 2;
  float: left;
  color: white;
  text-shadow: 2px 2px 2px rgba(250,250,250,0.1); 
  pointer-events:none;}
  </code></pre>
  
  <p>My question then is: Is there a solution (js or css) for this kind of problem? Any standart way to deal with it or a good hack.</p>