Можно ли равномерно распределить множество элементов в элементе div с изменяемой шириной.

Вотне работает пример, Если мы используем text-align: center; элементы будут центрированы, но margin: 0 auto; не работает. Я хочу сделать что-то вроде оправдания + центр:

|..........|       // for one container width
|........|               // for smaller container width
|............|                 // even smaller container

Контейнер будет изменяться пользователем. Одна картинка стоит 1000 слов:

Ширина контейнера (красная коробка): 100%; Таким образом, пользователь может изменить его размер (окно браузера, JS, что угодно). <

-> представлять четные пространства. Во втором ряду-> больше, потому что есть больше места. Я смог подделать это с:

text-align:center;
word-spacing:3em;    // but any fixed value looses proportion