Обрезать текст в div, если он превышает установленную ширину?

На веб-сайте, над которым я работаю, пользователи могут добавить заголовок к раздел страницы. Простой пример:

M11-001 - loss of container and goods from Manchester

С некоторыми заголовками содержание может быть довольно подробным. На самом деле, по крайней мере, для заголовка, это содержание не всегда нужно. Первые несколько слов достаточно, чтобы различать записи.

Я мог просто установить переполнение: скрыто в div и безжалостно вырезано из всего, что выходит за пределы установленной ширины.

Я бы предпочел добавить ... В конец. Примерно так:

M11-001 - loss of container...

Итак, три точки будут добавлены либо после ширины X, либо после X символов.

Возможно ли это с помощью CSS или, может быть, JavaScript?