如何使2列(单元格)的表格如下所示:
>第一个单元根据内容收缩
>另一个单元格适合表格的其余部分(宽于两个内容)
例:
<table style="width: 500px;"> <tr> <td>foo</td> <td>bar</td> </tr> </table>
我需要桌子看起来像这样:
.___________________________________________________________________________. | foo | bar <a lot of space here> | |_____|_____________________________________________________________________| 500 px total width
注意:我不知道“foo”的宽度,所以我不能设置“50px”,“10%”或类似的东西。
解决方法
您可以将第二个单元格的宽度设置为100%
HTML:
<table> <tr> <td>foo</td> <td class="grow">bar</td> </tr> </table>
CSS:
table { width: 500px; } .grow { width: 100%; }
检查this fiddle。