Restricting div height and adding an ellipsis to indicate truncation

Ellipsis in Firevox by using CSS

[SilverLining]

Hi

I have a very small space to fit some text in, so ideally would like to restrict the amount of characters (by height/two lines of text) and then to display an ellipsis.

This does work in IE, but in Firefox, althought the text is truncated too, the ellipsis is not displayed.

Here is a snippet of CSS:

.text {
 width: 100px; 
 height: 15px; 
 max-height: 15px; 
 overflow: hidden; 
 text-overflow: ellipsis; 
 white-space: nowrap;
}

Is it possible to get this working in Firefox?

[sgietz]

text-overflow only works in IE. You could probably achieve the same in FF with JavaScript.

[SilverLining]

Thanks. Thought this was part of CSS3, but see now that it is only supported by IE (IE6?). Want to stay away from too much JS.