如何使表格中一行的最后一个单元格占据所有剩余宽度
如何使表格中一行的最后一个单元格占据所有剩余宽度
提问于 2009-06-29 22:39:50
在下面的HTML片段中，如何使包含'LAST‘的列的宽度占据行的其余部分，而包含'COLUMN ONE’和'COLUMN TWO‘的列的宽度刚好足以容纳其内容，而不是更大。
谢谢
table {
border-collapse: collapse;
}
table td {
border: 1px solid black;
}<table>
<tr>
<td>
<table width="100%">
<tr>
<td>
<span>
COLUMN
</span>
<span>
ONE
</span>
</td>
<td>
COLUMN TWO
</td>
<td>
LAST
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
ANOTHER ROW
</td>
</tr>
</table>
回答 1
Stack Overflow用户
回答已采纳
发布于 2009-06-29 22:50:21
您需要告诉前两列不要换行，并将最后一列的宽度设置为99%：
<table width="100%">
<tr>
<td style="white-space: nowrap;">
<span>
COLUMN
</span>
<span>
ONE
</span>
</td>
<td style="white-space: nowrap;">
COLUMN TWO
</td>
<td width="99%">
LAST
</td>
</tr>
</table>编辑：您应该将所有样式/演示放入(外部...)css。
使用列的类(如果只针对现代浏览器，则可以使用像nth-child()这样的css3选择器)：
html：
<tr>
<td class="col1">
// etccss：
.col1, .col2 {
white-space: nowrap;
}
.col3 {
width: 99%;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1060933
复制相关文章
相似问题