show ellipsis after text length code example

Example 1: text-overflow ellipsis multiple lines

p {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

Example 2: css limit text length

/*CSS to limit the text length inside a div*/
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;

Example 3: restrict a paragraph height css

.class{
   word-break: break-word;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 16px; /* fallback */
   max-height: 32px; /* fallback */
   -webkit-line-clamp: 2; /* number of lines to show */
   -webkit-box-orient: vertical;
}

Example 4: css paragraph ellipsis

max-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

Example 5: show ellipsis after text length

max-width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
// div in a flex - assign width% , no need of even max-width !