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

Im在类似样式的表格中显示div和中的几个内容。Firefox，CSS显示：表格/表格单元格和高度

<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>

的glyphicon-remove应垂直居中，其在Chrome和IE 11而在Firefox 52

正常工作预期的结果是这样的：

Firefox的结果看起来像这样：

我在这里做错了什么？我创建了一个fiddle。

来源

2017-04-02 Alexander Zeitler

也许它与图标和容器，都显示为表单元格... https://jsfiddle.net/x1uydngo/10/ –

感谢呢！这导致我正确的方向，这里是最终结果（我需要着色不同于它的body/background的'separator'边框：https://jsfiddle.net/AlexZeitler/x1uydngo/13/ - 我也添加了一些宽度 - 根据我的需要将表格单元项目的值。 –

@GCyrillus请张贴您的小提琴作为答案，以便我可以将其标记为正确的答案。 –

mozilla不需要类class-glyphicon上的0.7em。所以我制定了该规则铬特定。继承人的链接工作小提琴，https://jsfiddle.net/x1uydngo/9/

@media screen and (-webkit-min-device-pixel-ratio:0) 
{ 
.item-glyphicon{top:0.7em;} 
}

来源

2017-04-02 20:10:30 lhavCoder

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

回答

相关问题