Вот пример для Google Chrome:

https://jsfiddle.net/2mt2scwk/4/

Прокручиваем скроллинг вправо, текст обрезан. Как исправить ситуацию?

Не пользоваться глючными браузерами не предлагать.

Up

Текст обрезается только у активного элемента.
Как я понимаю такой вариант (https://jsfiddle.net/2mt2scwk/4/) - не вариант.
"size=2" - обязательный атрибут?
Если в проекте есть jQuery - можете использовать Select2(https://select2.github.io). Огромный выбор возможностей.

(2) Ты дал ссылку на мой вариант. Не сохранил свой.

"size=2" - обязательный атрибут, поэтому я его и указал в примере. На самом деле там размер не 2, а 30 должен быть, но на ошибку это е влияет.

(2) Select2 - это сильно усложнит страничку. Не красиво так делать ради одной мелочи.

https://jsfiddle.net/k63w5spf/

если так?

(0) <Не пользоваться глючными браузерами не предлагать.>

любопытно что в ффоксе скролла вообще нет

(6) ФФокс - тру. Только уж очень не поворотлив стал

(7) да хром тоже уже давно не показатель быстроты и лёгкости

(5) Не пойдет. Пропал скролл по горизонтали.

(9) в ффоксе его нету

(10) Внимательно читаем вопрос (0). О ффоксе не было ни слова.

(11) "Не пользоваться глючными браузерами не предлагать." - я подумал должно работать во всех

первый вариант(который не сохранился)
https://jsfiddle.net/aL0yk1Ln/

(12) Это как раз означало что не во всех должно работать. Только в хроме.

Вариант хороший, с недостатком что нужно править HTML, одними средствами стилей не обойтись.
Спасибо за ответы. Если ничего лучше не придумать, темку можно закрыть.

вот ещё
https://jsfiddle.net/qku7p4o1/
тут надо size рассчитывать.

для FF не подходит

(14) Принцип как в предыдущем варианте. Я такой вариант уже доработал и применил на сайте. Спасибо