css: настройка flex на отображение максимально возможного количества столбцов

Приветствую

Подскажите, можно ли силами одного только css реализовать следующее:

У меня есть набор названий (состоящий из нескольких слов и цифр), которые я хочу вывести в несколько столбцов, притом таким образом, чтобы каждое название занимало строго одну строку, т.е. если вдруг встречается среди набора длинное название, то и столбцов будет меньше, если только короткие - столбцов больше.

Сейчас для набора названий я опытным путём определил, что кол-во столбцов должно быть равным 6, в результате имею такой код:

.multiselect {
    display:                    flex;
    flex-wrap:                  wrap;
    width:                      calc(100% - 20px);
    height:                     calc(100vh - 200px);
    margin:                     0px;
    padding:                    0px 10px;
    overflow-x:                 hidden;
    overflow-y:                 scroll;
}
.multiselect .record {
    margin:                     1px 5px;
    flex-basis:                 calc((100% - 20px - 6 * 10px) / 6);
    display:                    block;
}

И использую соответственно

<div class = 'multiselect'>
    <div class = 'record'>название#1</div>
    <div class = 'record'>название#2</div>
    ....
    <div class = 'record'>название#N</div>
</div>

Однако для нового набора названий оказалось оптимальным использование только 2х столбцов, в результате пришлось использовать такой код:

<div class = 'multiselect columns2'>
    <div class = 'record'>название#1</div>
    <div class = 'record'>название#2</div>
    ....
    <div class = 'record'>название#N</div>
</div>

Для чего определил такой стиль:

.multiselect.columns2 .record {
    flex-basis:                 calc((100% - 20px - 2 * 10px) / 2);
}

Но это все индивидуально, а как сделать универсально? Причем именно, чтобы все столбцы были одной ширины, а не один шире, другой уже