Html 带空白的td:nowrap文本超出单元格外部

我尝试在td属性上使用nowrap，以便可以在第一个表中看到结果：

正如你所看到的，在第一张桌子上，它包装得很好。 但是在第二张表中，第一个“td”超过了第二个“td”，因为内容太长了。 我该如何解决这个问题？ 这是我的密码：

<table cellspacing="0">
    <tr>
        <td class="content" style="width: 1%; white-space: nowrap; max-width:300px">
            /*php content*/
        </td>
        <td class="author">
            /*php content*/
        </td>
    </tr>
</table>

/*php内容*/
/*php内容*/

更清楚地说，以下是我想做的： 首先，我创建了一个列表，其中每个元素都是一个表，下面是每个列表代码的内容：

<div class="post">
<table cellspacing="0">
    <tr>
        <td class="content" style="max-width:300px">
        /* php content */
        </td>
        <td class="author">
            /* php content */
        </td;>
    </tr>
</table>
<div class="nav">
        /* php content for navigation buttons */
</div>

/*php内容*/
/*php内容*/
/*用于导航按钮的php内容*/

但结果是这样的：

正如您在第一个列表中看到的，在“test1”和“admin todo”状态之间有空格。

---

我想删除它，因此我使用nowrap方法。如果这不可能，是否有其他方法？

如果我正确地解释了问题并理解了您的预期结果，我建议您使用

文本溢出

由于您将300px表示为

td.content

的宽度，并且仍然希望只在一行中呈现内容，因此我猜唯一的解决方案是隐藏超出的内容。这可以通过以下简单的CSS完成：

.content{
  text-overflow:ellipsis;
  overflow:hidden;
}

---

认为将样式设置为

td

标记是非常有限的，您是否尝试过将文本包装在

div

或

span

中，并使用这种样式？您实际上不是指

normal

而不是

nowrap

？

nowrap

将防止

td

中断到下一行，所以这与你想要的正好相反，不是吗？@webeno尝试过，但是如果我使用div或span，第二个内容将被放置在第一个内容的第二行/第二行。我希望这两个内容在一行中。我认为您使用了错误的css属性。。。如果我是你，我会去掉第二个td，在文本后面加上空格或其他什么，然后把它粘在

span

标签后面，例如。。。