comment 0

CSS3 Ellipsis

CSS3 ellipsis for a straight text line. Overflow will be replace with three dots (…).

.css3-ellipsis {  
  overflow: hidden;
  white-space: nowrap;
  width: 150px;
  text-overflow: ellipsis;

Issues with CSS3 Ellipsis:

CSS3 ellipsis have specific requirement for tables, CSS property table-layout: fixed’ should be used;


or td as should be block;

	display: block; /* or inline-block */

For more you can have a full read on ellipsis here.