文本溢出：省略号;不截断溢出的文本并给出省略号

Question

我试图强制一个小div中的段落都是一行，没有换行，当它们溢出div时用省略号截断。

我没有使用white-space:nowrap;进行换行，但是文本仍然溢出div，即使我已将文本溢出设置为省略号。

我做错了什么？

它不应该是支持，因为令人惊讶的是，这两种css3属性都得到了广泛的支持。

这是问题的一个小问题：http://jsfiddle.net/4C7CW/

Answer 1

文字溢出

文本溢出声明允许您处理剪切文本：即不适合其框的文本。

文本溢出仅在以下情况下发挥作用：

• 该框有溢出而不是可见（溢出：可见文本只是流出框）
• 该框具有空格：nowrap或类似于约束文本布局方式的方法。 （没有这个，文本会换行到下一行）

因此...

#card
{
    width:200px;
    background:red;
    color:#000000;
    font-size:16px;
}

#card p
{
    -o-text-overflow:ellipsis;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}

http://jsfiddle.net/4C7CW/3/