为什么我的按钮看起来与IE不同？

Question

我试图找到一个解决方案，让我的按钮在Internet Explorer浏览器中看起来正确，但没有成功。这可能是什么问题？以下是该网站的链接：www.vivids.se。期待解决方案！ ：）

这是html：

<div class="share-wrapper">
 <span class="share-button">Dela</span>
 <a class="social-media-button" id="facebook" href="#">Facebook</a>
 <a class="social-media-button" id="twitter" href="#">Twitter</a>
</div>

这是css：

.share-button,
.social-media-button {
 font-weight: 600;
 display: inline-block;
 border-radius: 5px;
}

.share-button {
  padding: 0px 6px;
  border: solid 2px;
  border-color: #00d9ef;
  color: #00d9ef;
  cursor: pointer;
}

.share-button::after {
 content: url('img/share.svg');
 width: 13px;
 display: inline-block;
}

.social-media-button {
 padding: 2px 6px;
 background-color: #00d9ef;
}

#facebook::before {
 content: url('img/facebook.svg');
}

#twitter::before {
 content: url('img/twitter.svg');
}

#facebook::before,
#twitter::before {
 width: 13px;
 display: inline-block;
 margin-right: 5px;
}

左边的按钮是Safari（MacOS Sierra）。 右侧按钮是Internet Explorer 11（Windows 7）。

Answer 1

也许是缓存问题？我在IE11中打开它，看起来你说它应该是。