Text-overflow property - css3 ellipsis
Some times when data comes dynamically it may fall outside the element’s rendering box. CSS3
provides a great convenience when it comes to truncating too-long text:
the text-overflow property,this property allows the clipped content to
be
visually represented by the string “…” (called an “ellipsis”) in the
non-clipped area. Most modern browsers already support the CSS3
text-overflow property,
which will automatically calculate the right place to truncate text, and
add the ellipsis (except in Firefox). It works for Internet Explorer,
Safari, Chrome and Opera.
Syntax
text-overflow: clip|ellipsis|string;
Style:
Syntax
text-overflow: clip|ellipsis|string;
Style:
-o-text-overflow: ellipsis is how to make it work in Opera.
This works from at least Opera 9.0.
If you need to support firefox too then use jQuery.dotdotdot, plugin. It is a advanced cross-browser ellipsis for multiple lines content.
Comments