Line Clamping (Cross-Browser, Pure CSS)

This is a cross-browser (pure CSS) solution that will clamp text to X number of lines with a trailing ellipsis in Webkit browsers. The height property is used on other browsers (along with a fading text effect) as a graceful fallback in non-Webkit browsers. The use of CSS calc allows for any font-size to work properly; i.e. you don't need a fixed height or a fixed font size for this to work! Play with it :-) You can change the second class to line-clamp-[1|2|3|4|5] and experiment with this just a little.