title: IE 11 doesn't focus on span with tabindex
body: <h3>Setup:</h3>
  
  <p>We have an angular 5.x webapp which features a tree-component. It's basically a <code>&lt;ul&gt;</code>-List with a roving tabindex for keyboard navigation.<br/>
  The HTML is a little more complex due to the layout of the tree-component and it features some recursiveness. <br/>
  <br/></p>
  
  <h3>Problem:</h3>
  
  <p>We noticed a weird behavior in Internet Explorer when testing the TAB-focus. In the code-example below, you can see the <code>&lt;span&gt;</code> in line 8 has a <code>tabindex="0"</code> and should therefore be focusable via TAB-Key. The other nodes should not be focusable at this point. Now <strong>only</strong> in IE 11 the element is absolutely not focusable via keynavigation. All other browsers that were tested (Chrome, Edge, Firefox) handle the task just fine.<br/></p>
  
  <p><strong>Question:</strong> Why is IE 11 not focussing the <code>span</code> with <code>tabindex="0"</code> ?<br/>
  <br/></p>
  
  <h3>Example HTML for an angular component that reproduces the Issue:</h3>
  
  <pre><code>&lt;div id="hostDivForTree"&gt;
  &lt;ul class="subtree"&gt;
      &lt;li class="item ng-star-inserted" &gt;
          &lt;a class="toggleLink ng-star-inserted"&gt;
              &lt;i class="icon arrow"&gt;&lt;/i&gt;
          &lt;/a&gt;
          &lt;a disabled="false" class="nodeName expanded" id="treeIndex_0" data-tag="none"&gt;
              &lt;span tabindex="0" class="label"&gt;Marketing&lt;/span&gt;
          &lt;/a&gt;
          &lt;div class="collapse ng-star-inserted" aria-expanded="true" aria-hidden="false" style="height: auto; overflow: visible; display: block;"&gt;
              &lt;ul class="subtree"&gt;
                  &lt;li class="item ng-star-inserted"&gt;
                      &lt;a disabled="false" class="nodeName leaf" id="treeIndex_0_0" data-tag="good"&gt;
                          &lt;span tabindex="-1" class="label"&gt;Level 1&lt;/span&gt;
                      &lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="item ng-star-inserted" &gt;
                      &lt;a disabled="false" class="nodeName leaf" id="treeIndex_0_1" data-tag="none"&gt;
                          &lt;span tabindex="-1" class="label"&gt;Level 2&lt;/span&gt;
                      &lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/li&gt;
      &lt;!-- ... --&gt;
      &lt;!-- Here go further li - items like the one before - its recursive --&gt;     
      &lt;!-- ... --&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p></p>