Question

我有一个显示一些信息的表格。表中的最后一个“td”元素包含大量文本，我希望该文本在某个点之后被切断并且不会在表格单元格内部进行换行。这是我目前对表格行的所有内容：

<tr>
    <td> content</td>
    <td> content</td>
    <td> content</td>
    <td> content</td>
    <td> content</td>
    <td class="hidden"> really long content that wraps instead of hiding.</td>
</tr>

我的隐藏类的CSS：

div.hidden {
    white-space: nowrap;
    overflow: hidden;
    max-width: 90px;
}

我尝试过以几种不同的方式使用这些限制，这种方式让我最接近我想要的，但仍然包装文本而不是隐藏它。我试图让它在Chrome和IE中都能正常运行。有时将这些限制直接放在td元素上会使表格在Chrome中正确显示，但不会在IE中显示。关于如何解决这个问题的任何想法？

Answer 1

将div.hidden更改为td.hidden

http://jsfiddle.net/yPVQX/

更新：尝试添加

<colgroup>
    <col>
    <col>
    <col>
    <col>
    <col>
    <col style="width: 90px">
</colgroup>

和/或

.table {
   table-layout: fixed;
}

Answer 2

我采取了不同的方法来解决问题。我重写了我的表以使用Scala而不是普通的html，javascript，css等，并使用Scala来限制在屏幕上打印出的字符数量。可以在此处看到解决方案：How to limit the number of characters in a string displayed using Scala

感谢所有试图帮助解决此问题的人！

Answer 3

        <td nowrap> really long content that wraps instead of hiding. </td>

如何使td元素不在表格中包装文本？

3 个答案: