css

Text ellipsis for multi lines in CSS

.multi_line_ellipsis {
    display: -webkit-box;
    max-height: 3rem;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-line-clamp: 2;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.6rem;
}

Code is used for multi-line ellipsis of text in CSS. You can wrap the text with '...' added on the last. We use '-webkit-line-clamp' property to achieve this.

Was this helpful?