Is there a way to make a overflowing div go to the bottom when the width of the parent div is filled? I am facing an issue where tag 7 and 8 are overflowing. How can I make them go to the bottom when there is no more space available? Thank you
.main{
width: 300px;
height: 150px;
display:flex;
border: 2px solid #000;
padding: 10px;
}
.inner{
border: 1px solid #5eba7d;
margin-right:5px;
padding: 5px;
height: max-content;
width: max-content;
white-space:nowrap;
}<div class="main">
<div class="inner">tag 1</div>
<div class="inner">tag 2</div>
<div class="inner">tag 3</div>
<div class="inner">tag 4</div>
<div class="inner">tag 5</div>
<div class="inner">tag 6</div>
<div class="inner">tag 7</div>
<div class="inner">tag 8</div>
</div>