Css 隐藏溢出内容的灵活表

我有一个充满数据的表，通常非常易于管理，但有时我们会得到一个包含难以置信长的数据的列（通常是一个URL）。包装不是一个选项，因为垂直空间比水平空间更宝贵

我建议的选项基本上是在某些列上设置一个最小宽度（由用户标记），因此如果用户的浏览器足够宽，可以处理它，他们将看到整个字符串，如果没有，他们将看到一个截断的版本。我知道overflow属性在表单元格上不起作用，但幸运的是，我们已经将所有单元格内容包装在

中，所以我应该能够做到这一点

下面是我当前代码的修改：

您将在CSS中看到，我试图在第5列设置

min width

：

table th:nth-child(5),
table td:nth-child(5) {
    width: 1px; }
table th:nth-child(5) a,
table td:nth-child(5) span {
    background: rgb(180,180,180);
    min-width: 40px;
    text-overflow: ellipsis; }

但是，它不起作用。当浏览器太小而无法显示整个字符串时，我基本上需要该列来隐藏溢出的内容（最小宽度为40px）

如何实现这一目标的建议

---

哦，请注意，我的标记中没有列出“Javascript”。）

除非我有误解，否则请将

min width

更改为

max width

，以获取要截断的内容：

更新（因为我确实误解了）：

我会使用媒体查询在不同的浏览器宽度下调整

宽度

或

最大宽度

设置。在本例中，a

max width:100px：

对于不支持respond.js的浏览器，可以对媒体查询进行多边形填充。
但它需要灵活，具有最小宽度，而不是最大宽度。如果浏览器足够大，用户应该看到完整的字符串。如果没有，它应该崩溃，但不低于40px的最小宽度。啊，所以你希望流体表单元格的宽度不小于40px。我希望有一个更优雅的解决方案，但是的。。。这是个好主意。谢谢大家!@是的，我很想看看其他人会想出什么。也许这是不涉及javascript的，显然很多人都在尝试。我的第一个电话号码是7，第二个是22。或者一个人只是保存了很多版本。哈哈！真有趣。我还没有更新，所以是的，其他人很困惑。