CSS szerokość procent i text-overflow w komórce tabeli

Question

Mam tabeli gdzie szerokość komórki jest w procentach i chcę użyć text-overflow: ellipsis ukryć długie wiersze tekstu:

http://jsfiddle.net/Fm5bM/

w przykład elipsa działa dobrze w div, ale nie w komórce. Nadal rośnie i ignoruje zarówno width:60% i max-width:60%.

Jeśli dodaję komórkę display:block, tekst zatrzyma się na 60% i otrzyma wielokropek, ale całkowita szerokość komórki będzie nadal równa rozmiarowi całego tekstu.

http://jsfiddle.net/Fm5bM/3/

Docelowo chcę stół do rozmiaru ekranu. Czy jest jakiś sposób, aby to zrobić z czystym css?

Answer 1

Można to łatwo zrobić, używając numeru table-layout: fixed, ale "trochę podstępnego", ponieważ niewiele osób wie o tej właściwości CSS.

table { 
    width: 100%; 
    table-layout: fixed; 
} 

Zobacz go w akcji w zaktualizowanym skrzypce tutaj: http://jsfiddle.net/Fm5bM/4/