how to break a flex item to a new line code example
Example 1: break to a new line flexbox
<div class="container">
<div class="item"></div>
<div class="break"></div> <!-- break -->
<div class="item"></div>
</div>
<style>
/* Inserting this collapsed row between two flex items will make
the flex item that comes after it break to a new row */
.break {
flex-basis: 100%;
height: 0;
}
</style>
Example 2: new line in flex container
width: 100%;