title: Inspecting pseudo-elements in internet explorer
body: <p>I have the following pseudo-element:</p>
  
  <pre><code>input[type=radio].selected::before
  </code></pre>
  
  <p>In internet explorer the pseudo-elemen doesn't show at all, so I decided to take a look. I find the selector in the inspector (The selector in the inspector would be a great childrens-book!) But all properties are striked. (ie overwritten/not valid). Most attributes are not overridden by other attributes.  Is this default behaviour in IE or does this mean that the styling doesn't work at all and more importantly, why arent they showing? Below is the full css:</p>
  
  <pre><code>input[type=radio]{
      visibility:hidden;  
      cursor: pointer;
      width: 22px;
      height: 22px;
  }
  
  input[type=radio]::before{
      content: "";
      display: inline-block;
      visibility: visible;
      width: 16px;
      height: 16px;
      margin-bottom: 0;
      border: 1px solid #ddd;
      -moz-border-radius:8px;
      border-radius:8px;
      font-size: 41px;
      line-height: 18px;
      padding-left: 1px;
      color: #a3a3a3;
  }
  </code></pre>