奇怪的表列定位使用固定列

我有一個儀表板，我正在處理包含寬度爲100％的表格。在正常使用情況下，表格的列數大於屏幕的實際數量，儀表板會滾動顯示結果。但是，根據新的要求，我只顯示選定的服務器。這是我發現我的問題的地方。奇怪的表列定位使用固定列

表中有許多列，但主左手欄列出了每行，並且絕對位於頁面的左側。我附上一些示例代碼：

<html> 
<head> 
<style type="text/css"> 
.headercol { 
    position:absolute; 
    width: 15%; 
    left: 0; 
    top: auto; 
    padding-right: 0; 
    padding-left: 0; 
} 
</style> 
</head> 
<body> 
<body style="height: 90%"> 
<table style="width: 100%; border: 1px solid blue;"> 
<tr> 
    <td style="width: 200px;" class="headercol">asdf</td> 
    <td style="width: 200px;">adsf</td> 
    <td style="width: 200px;">adsf</td> 
</tr> 
</table> 
</div> 
</body> 
</html>

的問題是，這個組織下，表中的所有列未headercol現在變成右對齊創建在桌子中間的巨大空間。我希望他們回到他們左邊的合理位置。有沒有人知道這個工作？當不使用position:absolute時，版面會恢復正常，但我們會丟失固定列。在正常情況下，在表格中有空格填補空格的情況下，這不是問題。此行爲已注意到兩者IE11和Firefox 32

來源

2014-12-03 Cody Mays

我結束了浮動的所有TD的超過向左並指定爲第2列的靜態列的偏移。之後剩下的專欄只有float: left，一切都很好。一種奇特的做事方式，但它像一個魅力。

來源

2014-12-09 16:35:26

好了，如果你使用的是穩定的寬度在第一個每個<td>和position: absolute;，使您可以爲<td>其餘這樣做。也許擺脫<table>和使用<div>相反，它會更容易，更好:)

來源

2014-12-09 12:07:46

奇怪的表列定位使用固定列

回答

相關問題