How do you show just the first line of the particular td's text on a tr of a table and expand on click?

Viewed 14

There are 4 table headers are there and one table header's table data containing text like a paragraph. I need to show one line from the paragraph and if i click the particular td i need to expand the whole text with the row

1 Answers

You can do this with css. Put a class that make an ellips of your text and toggle it in listening to 'click' in your js.

.ellipse-text{
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    max-height: 2em;
    overflow: hidden;
    text-overflow: ellipsis;
}
Related