Вот посмотрите пример виджета с многострочной обрезкой.
JSfiddle
Самое главное правильно посчитать высоту строк. Это удобно делать в em.
Например: У вас есть стандартный шрифт в пикселях в документе установленый ТОЛЬКО один раз в теге html. Блоки разметки header, footer, aside, колонок и секций его не меняют. Шрифт меняется только внутренними элентами разметочных блоков.
Высоту блоков выставляете в em кратно line-height.
Меняете его только в единицах em/rem. И коректируете высоту line-height по формуле:
FSn / LHo = LHn,
где
FSn - новый font-size;
LHо - старый line-height;
LHn - новый line-height;
Кроме этого, если хотите чтобы верстка выглядела типографически верно (строки колонок совпадали на всей странице), нужно аккуратно соблюдать кратность отступов margin и padding к высоте строки.
Простой
Простой
