2012-01-09 105 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%; }