| Now we are using media queries of all screen width we can avoid this by using flex property & flex wrap to wrap and setting its base to some value so when there is no place for the content in particular screen width it will wrap into a new line so that no space will be left and contents would be responsive An example is given below |
HTML
<div class="container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
CSS
.container {
display:flex;
flex-wrap:wrap; /* this */
gap:10px;
}
.container > div {
height:100px;
flex:max(400px, 100%/3 - 20px); /* and this */
background:red;
}