One can do similar without Flexbox, thought Flexbox appears to be the best in this case.
<div class="outer">
<div class="inner"></div>
<div class="inner"></div>
<div class="inner">
<div class="deeper">
<div class="newLineContent"></div>
<div class="newLineContent"></div>
<div class="newLineContent"></div>
</div>
</div>
</div>
<div class="outer">
<div class="inner"></div>
<div class="inner"></div>
<div class="inner">
<div class="deeper">
<div class="newLineContent"></div>
<div class="newLineContent"></div>
<div class="newLineContent"></div>
</div>
</div>
</div>
.outer,
.deeper {
display: flex;
flex-wrap: wrap;
}
.inner {
flex-grow: 1;
padding: 20px 10px;
border: 1px solid white;
background: lightgray;
}
.inner:last-child {
flex-basis: 100%;
}
.newLineContent {
flex-grow: 1;
padding: 10px;
border: 1px solid white;
background: lightgray;
}