ie11，伪类绝对定位问题

在ie11中，我们给伪类设置的绝对定位后，有时候会出现，伪类偏移的情况

如下图

代码如下

      <div class="th-banner">
            <section>
                <hgroup>
                    <h2>Contact&nbsp;&nbsp;us</h2>
                    <p>我是下面的p标签</p>
                </hgroup>
            </section>
        </div>

.th-banner section h2 {
    font-size: 60px;
    font-weight: bold;
    position: relative;
    z-index: 1;
}

.th-banner section h2::before {
    content: '';
    width: 355px;
    height: 8px;
    background: #0086ee;
    position: absolute;
    z-index: -1;
    bottom: 10px;
    margin-left: -15px;
    left: calc(50% - 160px);/*加上这个就不会*/
}

问题，在于，那个h2标签的width是100%，在ie11中，绝对定位，初始位置就在了最左端了，在其他浏览器，就会出现在h2标签的最下方，开始计算的

那么就是ie11的对应的适配问题

其他浏览器如下图