2

我最近试图弄清楚如何使单元格/列适合其内容的宽度。我在 stackoverflow 上发现了一个问题,该问题似乎完全符合我的要求:如何使列的宽度适合其在 HTML 表中的内容?

我的问题是当我在单元格的内容中添加一个空格时,它添加了一个返回并将下一个单词撞到一行。

所以这段代码:

<div style="max-width:700px;">
<table border="1">

    <tr><td width="1px">Papua New Guinea:</td><td >Goroka</td></tr>
    <tr><td colSpan="2">this is a loooooooooooooooong text</td></tr>
</table>

生成此表:

http://cl‍.ly/image/2F0V1J3V2u22

相反,这就是我想要的:

http://cl‍.ly/image/2m0a0m0t0L0v

我意识到放入&nbsp;而不是空格可以解决这个问题。我的问题是,这是在邮件通讯模板中使用的,并且该单元格中的文本是动态的。有时有空格,有时没有。例如昨天它说玻利维亚,今天是巴布亚新几内亚,这是我注意到问题的时候。

4

1 回答 1

2

你试过了吗

td {
    white-space: nowrap;
}

http://jsfiddle.net/QkNqk/

你也可以使用

td {
    white-space: pre;
}

让源代码中的换行符创建中断。所以只要你没有换行符,文本就会停留在一行

于 2012-10-31T20:08:20.640 回答