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

Question

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

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

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

如果我查看页面，它看起来像:

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

有没有简单的方法来做到这一点？我尝试通过使其可见来移除溢出，然后重新应用它以隐藏它，但省略号在呈现时返回到原始 View 。

Answer 1

问题是 Table Cell 在 CSS 中的宽度是固定的:

宽度:120px;

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

将 CSS 更改为 min-width: 120px; 并使用 JavaScript 从 width 调整大小到 min-width 解决了这个问题。