问为什么我的按钮在IE中看起来不一样？
EN

Stack Overflow用户

提问于 2016-10-25 15:24:19

回答 1查看 92关注 0票数 0

我曾尝试为我的按钮找到在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西拉)。右边的按钮是Internet Explorer 11 (Windows 7)。