当 HTML 中的表格单元格有空白时，如何限制其宽度：nowrap？

Question

我有一个表格单元格，我希望它具有以下效果：

width: 100px;
white-space: nowrap;
overflow: hidden;

换句话说，该单元格应该始终是单行文本（其内容保证包含没有 HTML 标记的纯文本），它应该是最多 100px 宽，如果文本较长，则应进行裁剪。

不幸的是，当文本变长时，单元格仍然会拉伸。在 IE 和 FF 中进行了测试，这两个浏览器都是我的目标浏览器。

建议在单元格内添加

并将宽度设置为该值很困难。该表是从 gridview 控件生成的，它只是将指定的列宽添加到 元素并按原样插入文本。

Answer 1

您可以设置max-width:100px。实例： http://jsfiddle.net/tw16/RuAVq/

td{
    width: 100px;
    max-width: 100px; /* add this */
    white-space: nowrap;
    overflow: hidden;
}

问题通常是 IE不支持这个。

IE 支持的另一种解决方案是使用 float:left。实例：http://jsfiddle.net/tw16/RuAVq/1/

td{
    width: 100px;
    float: left; /* add this */
    white-space: nowrap;
    overflow: hidden;
}