центр горизонтально неопределенное количество divs?

Question

Я хочу реализовать кнопку, которая добавляет X число элементов рядом друг с другом (по горизонтали), но позволяет сказать, что все должно выглядеть центрированным, поэтому первый div должен появляться посередине, но если я снова clic, второй div должны появиться рядом с первым, но оба они должны выглядеть одинаково центрированными и так далее.

Я действительно не знаю, объяснил ли я себя и спасибо заранее.

Answer 1

Выровнять по центру контейнер из divs и отобразить divs inline.

$('.newDiv').on('click', function() { 
 
    $('.container').append('<div class="test">test</div>'); 
 
});

.container { 
 
    height: 30px; 
 
    width: 100%; 
 
    background: aqua; 
 
    text-align: center; 
 
} 
 
.test { 
 
    display: inline; 
 
    background: gold; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a class="newDiv" href="#">add div</a> 
 
<div class="container"></div>