Gerador de embrulho de caixa flexível
<style>
.flex-container {
display: flex;
justify-content: space-evenly;
align-items: stretch;
/* flex-flow: row wrap; */
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
background-color: #bbdefb;
height: 100%;
padding: 15px;
gap: 5px;
}
.flex-container > div{
background: #ffecb3;
border: 3px solid #ffcc80;
border-radius: 5px;
padding: 8px;
}
</style>
<div class="flex-container">
<div class="item1">item 1</div>
<div class="item2">item 2</div>
<div class="item3">item 3</div>
<div class="item4">item 4</div>
<div class="item5">item 5</div>
<div class="item6">item 6</div>
<div class="item7">item 7</div>
<div class="item8">item 8</div>
<div class="item9">item 9</div>
<div class="item10">item 10</div>
</div>
zombie 223