Select2 несколько столбцов: изменения после версии 3.4.5

В этом кодепене хорошо работает наличие нескольких столбцов для выбора: https://codepen.io/lembitk/pen/qBWONE

(этот кодовый пример был дан в комментарии к вопросу: Как реализовать выпадающий список из нескольких колонок с помощью Select2

Заголовки столбцов и содержимое, описываемое

<optgroup>

tags.

скриншот кодепена

Изменение ширины столбца в этом CSS работает, и обновляет результаты правильно:

.select2-results-dept-0 { /* do the columns */
  float: left;
  width: 15%;
}

Копирование этого кода (html, css и js) на чистую локальную тестовую страницу представляет опции в одном столбце, с невыбираемыми заголовками разделов, обеспечиваемыми тегами.

Насколько я могу определить, разница только в версии используемых библиотек Bootstrap, Jquery и Select2. Я попытался, успешно, получить используемую версию Select2@3.4.5 в кодепене: Тогда она работает, локально.

Я полагаю, что, возможно, класс select2-results-dept-0 был переименован/удален - но мне не удалось выяснить, на что.

Вы случайно не знаете, как получить этот эффект нескольких колонок в более поздних версиях Select2?

.select2-results-dept-0 { /* do the columns */
  float: left;
  width: 15%;
}

.select2-results__option[role=group]
  float: left ;
  width: 20%;
}