I am using Bootstrap 3 responsive tables for showing the data. However, One of column is having huge data compare to rest of the columns as shown below
But I would like to display limited length of description.
In short, I would like to display first 2 to 3 lines of data [or 300 characters] and followed by .....
If possible, hovering over the description column should show complete description as tooltip
How do I achieve this?
Set up maximum height on Table row and then Use CSS ellipsis property to show trim data (No JS/Jquery required).
http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/
It will trim when data overloads the table row and show dots automatically. You can show full data on tool tip just wrapping your data or view more with tool tip. You can thank me by accepting answer.
CSS:
apply a class mytable on tag and use this css: