引導的顯示器內部NAV元素：表單元格元素對火狐

Question

錯誤對準

考慮這個HTML標記（與引導LIB包括）：

<div class="container"> 
    <div class="card"> 
    <ul class="nav list"> 
     <li class="element"> 
     <a href="#">Element</a> 
     </li> 
     <li class="element"> 
     <a href="#">Another element</a> 
     </li> 
    </ul> 
    <div class="content"> 
    <div> 
     First content 
    </div> 
    <div> 
     Second content 
    </div> 
    </div> 
    </div> 
</div> 

這CSS代碼：

.container { 
    display: table; 
    layout: table-fixed; 
} 
.card { 
    display: table-row; 
    width: 300px; 
} 

li { 
    display: inline-block; 
    background-color: red; 
    padding: 20px; 
} 

.list { 
    display: table-cell; 
    width: 100px; 
    white-space: nowrap; 
} 

.content { 
    display: table-cell; 
    width: 200px; 
    background-color:blue; 
    height: 200px; 
} 

我已經搜索了很多，但仍然無法理解Firefox爲何顯示與Chrome不同的代碼。它只是給帶有導航欄的表格單元div提供某種填充/邊距，然後它不與其他頂部的內容表格單元對齊。見圖片：

有沒有人遇到這種類型的問題與Firefox /引導。我會感謝任何幫助，提前致謝！

現場演示：https://jsfiddle.net/9cztjd6o/3/

Answer 1

這種差距是由標準的引導造成的空行「：之前」的風格。你可以用類似的東西來隱藏它：

.container:before, .list:before { 
    display: none; 
}