固定テーブルレイアウトで単一のテーブルセルを展開するにはどうすればよいですか？

Question

私は3列の固定幅テーブルを持っています。私はテキストに基づいて最初の列のサイズを変更し、2番目の列は固定幅で、3番目の列は残りの領域を取り、セルに収まらない部分（テキストオーバーフロー：省略記号）を切り捨てる必要があります。テーブルは単なる行です。

ここに私のテーブルの簡易版だ...

<table> 
    <tr> 
     <td>250.9</td> 
     <td> | </td> 
     <td>This is really long and should be truncated</td> 
    </tr> 
</table> 

第一列は、1から250まで進数、単一小数の精度です。 2番目の列は、最初と最後の列の区切りにすぎません。 第3列は、入力されたタイトルであり、非常に長くなる場合がありますが、通常は提供されたスペースに収まります。ここで

は、私が試したものの一つを示したフィドルプロジェクトです：http://jsfiddle.net/A4N2z/2/

私も浮かべdiv要素のセットを試してみたが、それがない場合は、最後のdiv要素は次の行に折り返さフィット：http://jsfiddle.net/5Epvw/1/

誰かが別のアプローチを知っている場合は単なる行なので、テーブルである必要はありません。目標は、テキストを1行に整列させ、特定の幅よりも広くすることではありません。

Answer 1

あなたは、私は、テーブルを使用して文字（Iは見つけることができる最適なソリューション）に基づいて、タイトルを切り捨て最後に、このコードブロック（あなたは、必要に応じてコンテナの幅を変更することができます）

<div id="container"> 
    <div class="nbr">1.2.3</div > 
    <div class="sep"> | </div > 
    <div class="title">This is a really long title</div > 
</div> 

#container 
{ 
    width:500px; 
} 

#container div 
{ 
    display:inline-block; 
} 

Answer 2

を使用することができます。私はSugar.jsを使用して、値が動的であり、Sugarのtruncateメソッドが文字列をどのように切り捨てるかについてかなりスマートなので、クライアント上で実際の切り捨てを行いました。