文本对齐中心和绝对定位在IE-11中不能同时工作吗？

Question

以下脚本（https://jsfiddle.net/u9z76r6q/2/）并未将图像置于IE-11的中心位置：

＆＃13;

＆＃13;

.container {
  display: block;
  width: 400px;
  height: 200px;
  text-align: center;
  border: 1px solid black;
}
span {
  position: absolute;
 
}

＆＃13;

<a href="#" class="container">
  <span>
    <img src="https://redarrowmedia.files.wordpress.com/2012/03/arrow-logo1.png" alt="" width="40px" height="40px">    
  </span>
  </a>

＆＃13;

＆＃13;

＆＃13;

在所有其他现代浏览器中，箭头图像居中。这是Internet Explorer中的错误吗？

Answer 1

绝对定位的元素不占父母的宽度，其宽度取决于内容。不同的结果是因为不同的浏览器有不同的定位范围将width: 100%; left: 0;添加到span。

UPD：Chrome中的屏幕截图：

IE中的屏幕截图：

你可以在IE中看到跨度位于左侧，而在Chrome中居中。 跨度的内容仍然与中心对齐但跨度宽度太小而无法看到它！向span添加宽度并查看内部的内容将与中心对齐。 小提琴：https://jsfiddle.net/u9z76r6q/3/ 在IE中观看

UPD2：实际上Chrome浏览器的范围也不在中心位置。它的行为类似于left: 50%;。它的左边界位于中心。