我想要一个表中的一列中的文本不包装,而只是截断,以使其适合表单元格的当前大小.我不希望表格单元格更改大小,因为我需要的表格恰好是容器宽度的100％.
这是因为具有100％宽度的表格位于具有overflow的定位div内：auto(它实际上在jQuery UI.Layout面板中).
我尝试了两个溢出：隐藏和文本仍然包装.我尝试了空白：nowrap,但是它比100％更宽,并添加了一个水平滚动条.
div.container {
position: absolute;
overflow: auto;
/* user can slide resize bars to change the width & height */
width: 600px;
height: 300px;
}
table { width: 100% }
td.nowrap {
overflow: hidden;
white-space: nowrap;
}
<div class="container">
<table>
<tr>
<td>From</td>
<td>Subject</td>
<td>Date</td>
</tr>
<tr>
<td>Bob Smith</td>
<td class="nowrap">
<strong>Message subject</strong>
<span>This is a preview of the message body and could be long.</span>
</td>
<td>2010-03-30 02:18AM</td>
</tr>
</table>
</div>
有没有办法使用CSS来解决这个问题？如果我有一个固定的表格单元格大小,那么overflow：hidden将截断任何流过的东西,但是我不能使用固定的大小,因为我希望表可以用UI.Layout面板大小来扩展.
如果没有,那么我如何用jQuery解决这个问题？
解决方法
这很老,但这里是我的答案.
table { width: 100%; table-layout: fixed;}
