th和td的寬度是不同的

我想讓我的表頭是靜態的，但是每當我這樣做時，th和td寬度最終都會改變。我正在使用CSS做所有這些。我使表頭靜態的方式是固定其位置。th和td的寬度是不同的

我曾嘗試設置th和td寬度是相同的，但是這不起作用。

#idOfHeader th { width: 20px; } 
#idOfBody td { width: 20px; }

來源

2013-03-20 user1399078

請發表您的HTML更大。 – Lowkase 2013-03-20 13:04:04

使用山坳標籤在HTML

<table border="1" width="100%"> 
    <col width="100"> 
    <col width="50"> 
    <tr> 
    <th>Month</th> 
    <th>Savings</th> 
    </tr> 
    <tr> 
    <td>January</td> 
    <td>$100</td> 
    </tr> 
    <tr> 
    <td>February</td> 
    <td>$80</td> 
    </tr> 
</table>

fiddle

來源

2013-03-20 13:10:20

我試過了，即使使用了0填充，但由於某些原因td仍然不聽寬度，tr也沒有' t完全遵循我設定的寬度。有些更大一點。 – user1399078 2013-03-20 13:34:59

好的，我最終使用''來設計風格，但我確實認爲col也能起作用。我沒有看到任何變化的原因是由於我把它放在一個我沒有看過的不同文件表中>> ;;;儘管謝謝你的建議！我對這個問題進行了長時間的攻擊。 – user1399078 2013-03-20 14:48:28

th,td{ 

width:20px; 
max-width:20px; 
min-width:20px; 
}

也許你padding使得這種差異

來源

2013-03-20 13:06:37

我試過了，但由於某種原因td不想聽我的css – user1399078 2013-03-20 13:17:58

我不」明白爲什麼你不得不使用min-width， max-width或<col>。我認爲不同寬度的可能原因是內容某處強迫某個單元比所需寬度更寬，或者td和th有不同的填充。單元格的總寬度是寬度加上填充。

除非某個指定的填充，瀏覽器的默認內邊距將被應用，我猜th的填充可能是比td

來源

2013-03-20 13:13:43

我認爲它確實與填充有關，因爲當我將它設置爲0時，td最終被調整大小，至少要慢慢到達那裏！ – user1399078 2013-03-20 13:26:28

th和td的寬度是不同的

回答

相關問題