La elipsis '...' no es el color correcto

Question

Tengo una tabla con 3 puntos '...' al final de cada línea cuando es necesario (desbordamiento de texto). Usé el valor de la elipsis de la propiedad de desbordamiento de texto. Funciona: cuando se cambia el tamaño de la ventana, el '...' se mostró pero tengo 2 problemas cuando la línea en mi tabla contiene un lapso:

• el '...' son de color en el color de la fuente del tramo
• el '...' se cambia el tamaño el tamaño de la fuente del tramo

Ver demostración aquí: http://jsfiddle.net/Ah4DR/1/

Tal vez esto es una cuestión novato, pero buscaba un tiempo y no encontré ninguna solución.

Olvidé decir que esto no funciona en Internet Explorer, pero funciona bien en Chrome.

Gracias!

Answer 1

Ciertamente parece ser un error en IE. Es (por alguna razón) que lee el color del primer elemento (o tal vez es el primer contenido) para determinar el color de la elipsis. Sin embargo, encontré un "problema" para el error. Lo recomiendo si configurar esto de alguna manera con solo apuntar IE (y sólo los td elementos de que está utilizando text-overflow en) es posible, sino como una prueba de concepto, esto lo arregla:

td:before {content: ''; color: black;} 

Al parecer, la primera td el contenido que define el color no necesita ser contenido real, porque el pseudo contenido funcionó.

Answer 2

Tuve el mismo problema; mientras mi texto era blanco sobre gris oscuro, el color de la elipsis parecía negro. Lo resolví simplemente configurando el color del que contenía el desbordamiento de texto: puntos suspensivos, como este:

.ellipsis-div { 
    white-space: nowrap; 
    width: 154px; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    color: white;  /* --> ellipsis color */ 
}