Ne peut pas obtenir “text-overflow: ellipsis;” au travail

Je ne peux pas obtenir "text-overflow: ellipsis;" au travail...
Peut-être que quelqu'un peut donner ma un peu d'aide avec celui-là 🙂

Petit exemple:
http://jsfiddle.net/qKS8p/2/

http balisage:

<table class="" border="1">
    <tr><td colspan=3></td></tr>
    <tr class="">
        <td width="90"><span class="prose">column one</span></td>
        <td width="20"><span class="prose">column two</span></td>
        <td width="90"><span class="prose">column three</span></td>
    </tr>
    <tr><td colspan=3></td></tr>
</table>

de style css règles:

.prose {
  overflow: hidden;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

Je en droit d'attendre de la colonne "deux" à être coupée à cause de la td largeur de 20px. J'ai aussi essayé différentes variantes, avec des divs, tds, etc, mais je ne vois aucun changement. Notez que cela ne fonctionne pas dans n'importe quel navigateur j'ai vérifié. Il est certainement quelque chose me manque.

Il y a des millions de pages sur les exemples, les différences de navigateurs et de et de et de. Mais je ne peux pas obtenir que cela fonctionne ! Selon les informations actuelles de la simple text-overflow attribut est pris en charge dans tous les principaux navigateurs maintenant. Donc, je suis à la recherche d'un pur css solution (pas xul, pas de plugin jquery), depuis ce devrait travail.

Grâce,
arkascha

InformationsquelleAutor arkascha | 2012-03-04