Как без бубна, создания множества дополнительных классов и js сделать так, чтобы блоки не прижимались к левому боку, а выравнивались по центру, независимо от размера экрана?
html
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
<div class="class">Текст текст текст текст</div>
CSS
html, body
{
margin: 0;
padding: 0;
}
div
{
background: red;
}
.header
{
height: 100px;
width: 1%;
display:table-cell;
vertical-align:middle;
text-align:center;
font-size: 500%;
}
.class{
border: 3px solid black;
margin: 3px;
float: left;
display: box;
display: flex;
}