Ellipsis in firefox

The css ellipsis property from text-overflow does not work in firefox.
Using JQuery we can resolve this issue by simply cutting of the text and
adding the at the end dots when the text size is hidden by the overflow property.
This solution also makes the document W3C CSS valid.

Working firefox example

First sample link
Second sample link
Third sample link
Fourth sample link

How to use

1 Set the css attribute overflow of the parent to hidden so it can wrap the text.
Also give it a width so it knows where to apply the ellipsis.

2 Add the property class="ellipsis" to the element.

Download ellipsis example

JQuery ellipsis example (21kB)

Valid XHTML 1.0 Transitional Valide CSS!