The Problem

You have an area of text that needs to automatically truncate to fit the space.

Solution #1: Single Line Text

p {
max-width: 150px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

Solution #2: Multiple Lines of Text

p {
line-height: 2rem;
max-height: 8rem;
-webkit-box-orient: vertical;
display: block;
display: -webkit-box;
overflow: hidden !important;
text-overflow: ellipsis;
-webkit-line-clamp: 4;
}
Previous Next
Close
Test Caption
Test Description goes like this