Limit text length to n lines using CSS

Question

Is it possible to limit a text length to \"n\" lines using CSS (or cut it when overflows vertically).

text-overflow: ellipsis; only works for 1 line tex

Answer 1

What you can do is the following:

.max-lines {
  display: block;/* or inline-block */
  text-overflow: ellipsis;
  word-wrap: break-word;
  overflow: hidden;
  max-height: 3.6em;
  line-height: 1.8em;
}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vitae leo dapibus, accumsan lorem eleifend, pharetra quam. Quisque vestibulum commodo justo, eleifend mollis enim blandit eu. Aenean hendrerit nisl et elit maximus finibus. Suspendisse scelerisque consectetur nisl mollis scelerisque.

where max-height: = line-height: × in em.