字体很棒的fa-stack问题，而css没有应用Chrome PC

Question

我有一些代码，它以字体 - 真棒收件箱的形式显示未读邮件的通知，其中包含红圈警报和未读邮件的数量。代码在firefox（mac和pc）中运行良好（目前为止已经过测试），即chrome PC。

这是我使用http://codepen.io/johnstuif/pen/pvLgYp

的示例

这是firefox（Mac）上的样子

它无法在Chrome（Mac）上运行。我能够看到收件箱，但我无法看到红色圆圈和数字。

.fa-stack 
{
    margin-bottom: -60px;
}
  
.fa-stack[data-count]:after
{
position:absolute;
right:66.9%;
top:-5%;
content: attr(data-count);
font-size:30%;
padding:.5em;
border-radius:999px;
line-height:.60em;
color: white;
background:rgba(255,0,0,.85);
text-align:center;
min-width:.1em;
font-weight:bold;
}

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<a class="navbar-brand dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" id="inbox_container" style="margin-top: -9px">
<span class="fa-stack fa-2x" id="inbox_total" data-count="3">
    <i class="fa fa-inbox"></i>
</span>
</a>

我假设浏览器存在错误问题，但我不能为我的生活找出如何使用Chrome（mac），如果我可以的话。

Answer 1

我从一些搜索中发现，我所要做的就是做一个clearing of chrome cache and a hard reset，现在就可以了。

惊人！