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;

table{
	table-layout:fixed;
}

or td as should be block;

td{
	display: block; /* or inline-block */
}

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