使用表格单元格内的div内的跨度管理文本溢出

Question

我在span元素中有一个长文本，我想用省略号截断它。 span元素位于表格单元格内的div元素内。

如何以单元格的大小截断长文本。

此处为HTML代码段：

<table>
 <tr>
   <td>
     <div> 
       <span>
         this is a long sentence to test the text overflow
       </span>
     </div>
   </td>
 </tr>

CSS代码：

table {
 width: 50px;
 table-layout: fixed;
}

td {
 border: 1px solid red;
}

span {
 white-space: nowrap;
 text-overflow: ellipsis;
}

这是我在JSFiddle的案例： http://jsfiddle.net/Fedy2/wG3CF/

Answer 1

测试这个例子我的朋友们！

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

这里更新的JSFiddle代码段： http://jsfiddle.net/Fedy2/wG3CF/3/

Answer 2

是否有必要使用<span>？

它在<p>标记中工作。

http://jsfiddle.net/aashi/wG3CF/2/