Fonts потрясающая проблема с fa-stack, когда css не применяет Chrome PC

У меня есть код, который показывает уведомление о непрочитанных сообщениях в виде отличного шрифта почтового ящика с предупреждением в виде красного кружка и количеством непрочитанных сообщений. Код отлично работает (пока протестирован) в 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), если я вообще могу.


css glyphicons
person Cesar Bielich    schedule 07.03.2017    source источник
comment
Измените приведенный выше фрагмент, чтобы он отображался должным образом (в работающих браузерах).   -  person Lee Taylor    schedule 07.03.2017
comment
это то, что я получил до сих пор, не уверен, почему красный значок не горит. Странно, что я вижу это здесь, в стеке, но не на моем сайте с Mac под управлением Chrome   -  person Cesar Bielich    schedule 07.03.2017

Ответы (1)


arrow_upward
0
arrow_downward

В ходе поиска я обнаружил, что все, что мне нужно было сделать, это выполнить очистку хромированный кеш и полный сброс, и теперь он работает.

Удивительный!

person Cesar Bielich    schedule 07.03.2017