我有同样的问题，但我需要显示多行(其中text-overflow:省略号;失败)。我解决它使用一个TD内的文本区域，然后样式它的行为像一个表格单元格。

    textarea {
        margin: 0;
        padding: 0;
        width: 100%;
        border: none;
        resize: none;

        /* Remove blinking cursor (text caret) */
        color: transparent;
        display: inline-block;
        text-shadow: 0 0 0 black; /* text color is set to transparent so use text shadow to draw the text */
        &:focus {
            outline: none;
        }
    }

Yep I would say thirtydot has it, there is no way to do it unless you use a js method. You are talking about a complex set of rendering conditions that you will have to define. e.g. what happens when both cells are getting too big for their apartments you will have to decide who has priority or simply just give them a percentage of the area and if they are overfull they will both take up that area and only if one has whitespace will you stretch your legs in the other cell, either way there is no way to do it with css. Although there are some pretty funky things people do with css that I have not thought of. I really doubt you can do this though.

问题在于“table-layout:fixed”，它会创建间距均匀、宽度固定的列。但是禁用这个css属性将杀死文本溢出，因为表将变得尽可能大(并且没有任何东西可以溢出)。

我很抱歉，但在这种情况下，弗雷德不能鱼与熊掌兼得。除非房东一开始就给塞尔迪托更少的工作空间，否则弗雷德就不能使用他的…

我相信我有一个非javascript的解决方案!我不想满足于JavaScript的修复，因为我发现页面加载后东西移动的轻微抖动是不可接受的。

特点:

没有JavaScript 没有固定布局 没有加权或百分比宽度技巧 适用于任意数量的列 简单的服务器端生成和客户端更新(不需要计算) 跨浏览器兼容的

How it works: Inside the table cell place two copies of the content in two different elements within a relatively-positioned container element. The spacer element is statically-positioned and as such will affect the width of the table cells. By allowing the contents of the spacer cell to wrap we can get the "best-fit" width of the table cells that we are looking for. This also allows us to use the absolutely-positioned element to restrict the width of the visible content to that of the relatively-positioned parent.

测试和工作在:IE8, IE9, IE10, Chrome, Firefox, Safari, Opera

结果图片:

JSFiddle: http://jsfiddle.net/zAeA2/

示例HTML / CSS:

<td>
    <!--Relative-positioned container-->
    <div class="container">
        <!--Visible-->
        <div class="content"><!--Content here--></div>
        <!--Hidden spacer-->
        <div class="spacer"><!--Content here--></div>
        <!--Keeps the container from collapsing without
            having to specify a height-->
        <span>&nbsp;</span>
     </div>
</td>

.container {
    position: relative;
}
.content {
    position: absolute;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.spacer {
    height: 0;
    overflow: hidden;
}

<table style="table-layout: fixed; max-width: 100%;">
    <tr>
        <td>
             <div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap">This cells has more content</div>
        </td>
        <td>Less content here</td>
    </tr>
</table>

我最近一直在研究它。检查这个jsFiddle测试，自己尝试改变基本表的宽度来检查行为)。

解决方案是将一个表嵌入到另一个表中:

<table style="width: 200px;border:0;border-collapse:collapse">
    <tbody>
        <tr>
            <td style="width: 100%;">
                <table style="width: 100%;border:0;border-collapse:collapse">
                    <tbody>
                        <tr>
                            <td>
                                <div style="position: relative;overflow:hidden">
                                    <p>&nbsp;</p>
                                    <p style="overflow:hidden;text-overflow: ellipsis;position: absolute; top: 0pt; left: 0pt;width:100%">This cells has more content</p>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td style="white-space:nowrap">Less content here</td>
        </tr>
    </tbody>
</table>

Fred现在对Celldito的扩张满意吗?