我希望单元格中的一些较长文本重叠在下一个单元格中,而不是换行,但又不会使第一列变大。
如果我给细胞
white-space: nowrap;
position: absolute;
它将位于正确的位置,但其他文本将在其下方流动。
感谢您的快速答复。
您可以通过设置使单元格的内容流入同一行的其他单元格overflow: visible
、防止换行、设置固定宽度,这也需要固定表格布局。您还需要暂时为表格设置固定宽度,否则浏览器将不会进行固定表格布局。
<style>
.x {
width: 3em;
white-space: nowrap;
overflow: visible;
color: red;
}
table {
table-layout: fixed;
}
th:nth-child(1) { width: 3em; }
th:nth-child(2) { width: 15em; }
th:nth-child(3) { width: 2em; }
th:nth-child(4) { width: 7em; }
th:nth-child(5) { width: 3em; }
</style>
<table border cellspacing=0>
<thead>
<th>nr<th>name<th>year<th>category<th>price
<tbody>
<tr>
<td><div class=x>A longer line that should not wrap , but go over the other cells</div></td>
<td><td><td><td>
<tr>
<td>999.0
<td>Some name
<td>2000
<td>Some category
<td>135.32
</table>
这非常复杂,您可能应该按照@MikeW的建议进行操作,这不会使单元格内容溢出到其他单元格,而是使单元格跨越所有五列。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)