Wie kann ich eine einzelne Tabellenzelle in einem festen Tabellenlayout erweitern?

Question

Ich habe eine feste Breite Tabelle, die 3 Spalten hat. Ich möchte, dass die erste Spalte basierend auf dem Text die Größe ändert, die zweite Spalte ist feste Breite und die dritte Spalte sollte den Rest des Speicherplatzes nehmen und jeden Teil abschneiden, der nicht in die Zelle passt (text-overflow: ellipsis). Die Tabelle ist nur die einzelne Zeile.

Hier ist eine vereinfachte Version meiner Tabelle ...

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

1. Spalte eine Dezimalzahl von 1 bis 250, einzelne Dezimalgenauigkeit ist. Die zweite Spalte ist nur ein Trennzeichen zwischen der ersten und letzten Spalte. Die dritte Spalte ist ein benutzerdefinierter Titel, der sehr lang sein kann, obwohl er normalerweise in den dafür vorgesehenen Platz passt.

ist hier ein Fiddle-Projekt, das eines der Dinge zeigt, die ich habe versucht: http://jsfiddle.net/A4N2z/2/

ich auch eine Reihe von schwebte divs habe versucht, aber die letzte div hüllt in die nächste Zeile, wenn es nicht der Fall ist passend: http://jsfiddle.net/5Epvw/1/

Da es nur eine einzelne Reihe ist, muss es nicht eine Tabelle sein, wenn jemand eine andere Annäherung kennt. Das Ziel besteht darin, dass der Text in einer einzelnen Zeile steht und nicht breiter als eine bestimmte Breite ist.

Answer 1

Sie diesen Codeblock verwenden können (Sie können die Breite des Behälters ändern, falls erforderlich)

<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

Am Ende habe ich eine Tabelle verwendet, und abgeschnitten den Titel basiert auf Zeichen (beste Lösung, die ich finden konnte) . Ich habe Sugar.js verwendet, um die tatsächliche Kürzung auf dem Client zu tun, da der Wert dynamisch ist und die truncate-Methode von Sugar ziemlich schlau darüber ist, wie sie die Zeichenfolge abschneidet.