什麼影響​​和<th>元素的寬度？

Question

我試圖修復一個表頭到窗口的頂部，但由於某種原因以下列方式設置<td>和<th>元素的寬度不會導致元素具有相同的寬度（列標題不與其它列單元格對齊）：

th, td { 
    padding-left: 20px; 
} 

td:first-child, th:first-child { 
    width: 80px; 
} 

td:nth-child(2), th:nth-child(2) { 
    width: 200px; 
} 

td:last-child, th:last-child { 
    width: 320px; 
    padding-right: 20px; 
} 

下面是說明了這一個的jsfiddle例如：http://jsfiddle.net/zgaPw/1/

用它進行試驗後，我發現font-size屬性似乎影響<td>的寬度，但我不知道爲什麼或如何糾正它。

有人可以指出什麼是錯的，以及如何糾正它？謝謝！

Answer 1

單元格的寬度受其兄弟（其他單元格）和父級（<table>）的影響。爲了讓細胞具有相同的寬度，確定細胞上的寬度屬性，它等於：

For each cell: 
    width + padding left + padding right 
= 660px; 

在你的第一行，包含<th>元素，您已經定義的600px的寬度，這會導致頭部縮小一點。要解決此問題，請刪除行上的width屬性，或者定義width:660px;。

小提琴：http://jsfiddle.net/zgaPw/4/