Firefox 不显示图像

Firefox doesn't show images

我们有一个带有各种 span 标签的 gridx 链接到带有图像的 css。

HTML 在 gridx:

<span class="icon active"/>

CSS:

.icon.active{
   content:url(../imgs/attivo.png);
   height: 16px;
}

问题是 Firefox 加载图像(我们可以用 firebug 看到它)但我们看不到它们。在所有其他浏览器中它工作正常。

尝试.icon.active::after

.icon.active::after{
   content:url('https://placeholdit.imgix.net/~text?txtsize=5&txt=i&w=26&h=26');
   height: 26px;
}
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>

或背景图像:

.icon.active {
  background: url('https://placeholdit.imgix.net/~text?txtsize=5&txt=Q&w=26&h=26') no-repeat;
  height: 26px;
  width: 26px;
  display: inline-block;
  content: "";
}
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>
<div class="table"><span class="icon active"></span></div>

你可以试试

class="Haldocompose"

Link 到文档: https://docs.google.com/document/d/10i5agK1Ot1eiB_R5JVEVHY41B0rEvjVyeQ1rl50DTdY/edit