td内のdivのテキストを切り捨てる（単位相対幅）

Question

次の例のcssでテキストを切り捨てる必要があります。

Example of the problem in jsfiddle

<table border="1" width="100%" cellspacing="1" cellpading="1"> 
    <tr> 
    <td align="center" width="50%"> 
     <div>test1 test1 test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1</div> 
    <td align="center" width="50%"> 
     <div>TEST2</div> 
    </td> 
    </tr> 
</table> 

私はdivの中に直接切り捨てプローブが、それは相対的な対策では動作しません。

Example in jsfiddle

<table border="1" width="100%" cellspacing="1" cellpading="1"> 
    <tr> 
    <td align="center" width="50%"> 
     <div style=" white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis;">test1 test1 test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1</div> 
    <td align="center" width="50%"> 
     <div style=" white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis;">TEST2</div> 
    </td> 
    </tr> 
</table> 

任意のアイデア？。ありがとう

Answer 1

"text-overflow：省略形"を使用できますか？

... 
    <div id="test">test1 test1 test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1test1 test1</div> 
... 

CSSファイル：どこかあなたのJSコードで

#test{ 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
} 

：

$("#test").width(200); 

これはあなたを与える： "TEST1 TEST1 TEST1 test1test1 test1te ..."

されていますこの便利な？