调整容器大小时刷新CSS省略号

Question

我正在使用jQuery UI并设置了一个表来调整列的大小。

span {      
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

我对单元格应用了一些简单的省略号，这样当它们太小时我得到了......

如果我看一下它看起来像：

但是，当我调整列的大小时，它不会重新应用省略号：（

有一种简单的方法吗？我尝试通过使溢出可见来删除溢出，然后重新应用它以隐藏，但省略号在渲染时返回到原始视图。

Answer 1

问题是表格单元格在CSS中具有固定的宽度：

width: 120px;

然后使用JavaScript调整了大小。当调整大小时，单元格中的单元格内容保持相同的宽度。

将CSS更改为min-width: 120px;并使用JavaScript从width调整为min-width可以解决问题。