text-overflow:省略号在IE9中不起作用

时间:2013-09-26 07:32:57

标签: jquery css html5 css3

我已经尝试了以下代码到我的td,但没有好的迹象。

.td_class{
max-width:100px;
overflow: hidden;
text-overflow : ellipsis;
-ms-text-overflow : ellipsis; 
}

任何帮助?

3 个答案:

答案 0 :(得分:0)

试试这个,

td
{
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

答案 1 :(得分:0)

如果您将<th>中的文字包含在其他元素中,并将widthoverflow应用于该文件,那么它将起作用:

http://jsfiddle.net/nkLav9f7/6/

<table>
    <thead>
        <tr>
            <th><span>This is a really long header</span></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>foo</td>
        </tr>
    </tbody>
</table>

table, td { border: solid 1px black }

th
{
    max-width: 50px;
}

span
{
    overflow: hidden;
    display: block;
    width: 50px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

答案 2 :(得分:0)

如果您在“* {word-wrap:bread-word}”等其他风格中设置了“自动换行:面包词”,请将其更改为“ word:换行:正常“。它对我有用。