Colocar blocos lado a lado e centralizados sem saber quantos blocos serão

Já perdi uma horas tentando achar uma solução para isso, mas não obtive sucesso.

É o seguinte: Preciso criar divisores que vão se alinhar lado a lado e devem ficar no centro de outro divisor, o que até aí tudo bem, moleza.

O problema é: Acontece que vou buscar resultados em um banco de dados e no loop gerado vão ser criados blocos para cada resultado.

Digamos que eu vá buscar usuários cadastrados, logo terei logins, senhas e-mails etc.. Para cada usuário obtido quero criar um divisor que conterá seus dados.

Acontece que se houver 1 ou 2 ou mais resultados, ou seja independente da quantidade que obter  deve-se criar 1 bloco para cada e cada bloco deve-se se alinhar ao centro em relação lado a lado com outros se houver mais de 1 resultado.

Obs.: Normalmente usaria uma "table", mas o website que estou a fazer recebe design responsivo e não estou afim de usar overflow para a tabela e sim como disse criar um divisor para cada resultado.

Acho que consegui explicar, mas se precisar de mais informações é só falar...

Vamos ao código criado para simular e fazer o teste.

Spoiler

<div class="caixa-mae">
 <div class="caixa-filha">
 <p><b>Login:</b> ABCDEFGHIJ</p>
 <p><b>Senha:</b> ABCDEFGHIJ</p>
 <p><b>E-Mail:</b> ABCDEFGHIJ</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </div>
 <div class="caixa-filha">
 <p><b>Login:</b> ABCDEFGHIJ</p>
 <p><b>Senha:</b> ABCDEFGHIJ</p>
 <p><b>E-Mail:</b> ABCDEFGHIJ</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </div>
 <div style="clear: both">
</div>

 CSS

.caixa-mae {
 background-color: #e5e5e5;
 margin: 0 auto;
 max-width: 900px;
 width: 100%;
 padding: 10px;
 font-size: 0.90em
}

.caixa-filha {
 float: left;
 border: 1px solid #bcbcbc;
 min-width: 340px;
 width: 38%;
 margin-right: 2%
}

	 

	No exemplo tenho 2 blocos, que deveriam se alinhar ao centro da div mãe, que deveria acontecer o mesmo se fosse 3 ou 1 divisor só.

	A melhor alternativa que pensei para alinhar as div filhas lado a lado foi por meio float.

	E então? Como vou fazer isso?