Center inline-blocks com largura dinâmica em CSS

Então .. eu tenho uma página de largura dinâmica. Abaixo, a div do wrapper centraliza as divs dentro dele. No entanto, cada div tem um estilo de:

display:inline-block;
width:400px; /* static */

Isso faz as divs internas, lado a lado. Mas isso significa que resta algum espaço em branco, dependendo da largura do navegador e quantas divs podem ir lado a lado sem passar para a próxima linh

Para ter uma idéia do que estou procurando, abra a página Nova guia do Google Chrome e arraste a janela do navegador para diminuí-la. Você verá que, quando for longe demais, alguns aplicativos do Chrome passam para a próxima linha, mas ainda permanecem centralizado

No meu caso, eles passam para a próxima linha e não ficam centralizado

É assim que meu código se parece:

<div class="wrapper">
    <div class="iB"></div>
    <div class="iB"></div>
    <div class="iB"></div>
    <div class="iB"></div>
    <div class="iB"></div>
    <div class="iB"></div>
</div>

Eu quero que as divs internas fiquem lado a lado, a menos que não haja espaço suficiente; nesse caso, a extremidade final tropeçará na próxima linha abaixo, ALL enquanto estiver centralizada na div pa

Obrigado por qualquer ajuda

questionAnswers(4)

yourAnswerToTheQuestion