Czy możliwe jest równomierne rozmieszczenie wielu elementów w div ze zmienną szerokością.

Otonie działający przykład. Jeśli użyjemy text-align: center; elementy będą wyśrodkowane, ale margines: 0 auto; nie działa. Chcę osiągnąć coś takiego jak justify + center:

|..<elem>..<elem>..<elem>..<elem>..|       // for one container width
|..<elem>..<elem>..<elem>..|               // for smaller container width
|....<elem>....<elem>....|                 // even smaller container

Kontener będzie mógł zmieniać rozmiar użytkownika. Jedno zdjęcie jest warte 1000 słów:

Szerokość kontenera (czerwone pole): 100%; Użytkownik może więc zmienić jego rozmiar (okno przeglądarki, js, cokolwiek).
<--> reprezentują parzyste przestrzenie. W drugim rzędzie <--> są większe, ponieważ jest więcej miejsca. Udało mi się to sfałszować:

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