Troncare una riga di testo con CSS

Capita spesso di voler troncare una riga di testo per mantenere il layout consistente con diverse risoluzioni dello schermo.

Una soluzione semplice ed efficace è quella di usare questa classe:

.truncate {
 width: 150px;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}