2012-01-09 101 views
6

有什麼辦法讓左邊的第一列有最小的寬度......比如50%。第一列表格的最小寬度

我已經有了不同數量的單獨表格(具有不同的標題,因此它們是單獨的數據片段)。

顯然,表格列根據內容的多少來改變它們的寬度......如果它需要額外的空間,那麼它將需要來自同一表格中其他列的更多空間......這很酷,但是當很多空間,它不需要任何額外的空間,那麼它的很多整潔,如果他們都只是停留在相同的寬度......像50%

http://jsfiddle.net/mqatP/5/

任何想法如何做到這一點沒有在PHP中測試多少內容正在進入他們並添加不同的類?

感謝,大教堂

回答

5

我很驚訝地發現min-width沒有做t裏克。然而,與它玩了一會兒後,我遇到了這個解決方案:

td:first-child { 
    width: 40%; 
    white-space: nowrap; 
} 
+0

這似乎是很酷。甚至寬度:50%也起作用。因此,如果有足夠的空間並且使用空間(如果有足夠的空間),它將保持它們全部對齊。我有3列有時會把這些搞砸,但我懷疑他們可以在沒有col-2,col-3和不同風格的情況下進行修復。 – 2012-01-09 17:44:06

+0

雖然,如果你的文本太長,那麼它會溢出而不是包裝......但是我想沒有辦法解決這個問題 – 2012-01-09 17:48:08

2

我建議你試試這個修復表格的寬度在CSS

table-layout:fixed; 

和JavaScript語法是:object.style.tableLayout="fixed"

+0

我想這是最乾淨的解決方案,但力量包裹時,有空間,它可以使用 – 2012-01-09 17:48:45

1

你可以使用

tbody>tr>td:nth-child(1), 
tbody>tr>td:nth-child(2), 
tbody>tr>td:nth-child(3) { width: 50%; }