I'm working with this jsfiddle. I would like the <p>Super long words here</p>
to look like Super lon...
instead of showing the full text. I tried adding
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
But it didn't work. How can I get my overflow text to end in an ellipsis?
You have to specify a width to achieve this effect, like this:
.pClass p {
margin: 0 !important;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width:20px;
}