如何创建“溢出：隐藏”表列[重复]答案

【问题标题】：How to create an "overflow: hidden" table column [duplicate]如何创建“溢出：隐藏”表列[重复]
【发布时间】：2015-10-15 07:02:50
【问题描述】：

我希望我的 <table> 行为正常（高度和宽度根据内容而变化），但我想要一个行为类似于“table-layout:fixed;”表中的“overflow: hidden”列的单列，这意味着它应该有一个固定的宽度，任何溢出的内容都会被切断。

显然，因为我不能使用table-layout-fixed，因为这会影响所有列，而不仅仅是我需要具有固定宽度的列。

Related Question

【问题讨论】：

那里没有回答吗？ stackoverflow.com/a/509740/483779
您可以使用table-layout: fixed，只需使用nth-child 将宽度和溢出属性应用于一列中的表格单元格like this example

标签： html css

【解决方案1】：

尝试在要隐藏溢出的列上使用最大宽度

<style>
    .hideOverflow {
        max-width: 10px;
        overflow: hidden;
    }
</style>

<table style="width:25%">
    <tr>
        <td class="hideOverflow">Jillsssssssssssssssssssssssssssssssssssssssssssss</td>
        <td>Smith</td>      
        <td>50</td>
    </tr>
<table>

希望对你有帮助

【讨论】：

如果您对此进行测试，它不起作用。细胞伸展。
我只是将该代码复制粘贴到 html 文件中并在 chrome 中运行它并且工作正常。
如果可能的话，你能解释一下为什么它不适合你吗？我很想知道，所以我不会再犯这个潜在的错误。我没有看到我这边的问题就是这样:)
它看起来因为它的宽度很小。 If you look at this example, with the table stretched at 100%，细胞伸展:)