Html Firefox、CSS显示：表格/表格单元格和高度

Im以类似表格的方式在

div

和

span

元素中显示多个内容

<div class="row">
  <div class="item">
    <div class="item-col-glyphicon">
      <span class="glyphicon glyphicon-remove item-glyphicon"></span>
    </div>
    <div class="item-col1">
      <span class="item-col1-a">a</span>
      <span class="item-col1-b">b</span>
    </div>
    <div class="separator"></div>
    <div class="details">
      <span style="display:block">Line 1</span>
      <span style="display:block">Line 2</span>
    </div>
  </div>
</div>

A.
B
第1行
第2行

glyphicon remove的

图标应该垂直居中，这在Chrome和IE 11中可以正常工作，但在Firefox 52中不能

预期结果如下所示：


Firefox的结果如下所示：


我做错了什么？
我创建了一个。mozilla不需要类项glyphicon上的0.7em。所以我把这条规定具体化了。这是工作小提琴的链接

也许它与图标及其容器有关，它们都显示为表格单元格。。。谢谢这使我找到了正确的方向，这是最终的结果（我需要将
分隔符
边框着色，与主体/背景不同：-我还根据需要向表格单元格项添加了一些宽度值。@GCyrillus请将您的小提琴作为答案发布，以便我可以将其标记为正确答案。
@media screen and (-webkit-min-device-pixel-ratio:0)
{ 
.item-glyphicon{top:0.7em;} 
}