CSS3 Click Chart | CSS3 Browser Support and Information

Text Overflow

Defines how to signal to the user that text is overflowing its parent. This can be done using an ellipses or custom string.

Specification

Text Overflow on W3C

Example Code

.element {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis; /* or "clip" */
}

Live Demonstration

Click and hold to see the remainder of this text that overflows its parent. The rest of this is just filler text.

Desktop Browser Support

Standard Syntax:
IE6+, Firefox 7+, Chrome 4+, Safari 3.1+, Opera 11+

Vendor Syntax:
Opera 9+, IE8+

Tools / Polyfills

Tutorials / Articles

Text Overflow on MDN
New CSS3 Properties to Handle Text and Word Wrapping