CSS hides content that exceeds the display width.

Common text truncation (applicable to inline and block ):
. Text-overflow {
Display: block;/* Add inline objects */
Width: 31em;/* specify the width */
Word-break: Keep-all;/* Do not wrap */
White-space: nowrap;/* force all texts to be displayed in the same row until the text ends or BR objects are encountered. Do not wrap */
Overflow: hidden;/* Hide the content beyond the width of the content */
Text-overflow: ellipsis;/* Private Attribute of IE. When the text in the object overflows, the omitted mark (...) is displayed. It must be used with overflow: hidden. */
}

Definition of table text overflow:

Table {
Width: 30em;
Table-layout: fixed;/* only the table layout is defined.AlgorithmFor fixed, the following definition of TD can take effect. */
}
TD {
Width: 100%;
Word-break: Keep-all;/* Do not wrap */
White-space: nowrap;/* Do not wrap */
Overflow: hidden;/* Hide the content beyond the width of the content */
Text-overflow: ellipsis;/* indicates the omitted mark (...) when the text in the object overflows. It must be used with overflow: hidden. */
}
It should be noted that this stuff is only effective for a single line of text. If you want to use it on multiple lines, it only works for the first line. This method is only written in IE, where "..." is hidden when the text of other browsers exceeds the specified width.
From: http://www.cnblogs.com/WildRam/archive/2009/09/04/1560037.html