How to prevent block wrapping?

Question

Bootstrap

There is a code that displays info blocks, how can you prevent blocks from wrapping if they are of different heights?

<div class="row">
<?php foreach ($v as $vs) { ?>
<div class="col-xs-6 col-sm-4 col-md-4 col-lg-3">
................
    
</div>
<?php } ?>
</div>

Answer 1

put clearfix in the right places. for example like this. tobish every n-th number of divs for the necessary xs md lg, etc.

<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="clearfix visible-xs"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="clearfix visible-sm visible-md"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="clearfix visible-xs"></div>
<div class="clearfix visible-lg"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>
<div class="clearfix visible-xs"></div>
<div class="clearfix visible-sm visible-md"></div>
<div class="col-xs-6 col-sm-4 col-lg-3"></div>

Answer 2

For this, it is used, which is a "line" in which 3 blocks are placed in a row, i.e. so that you do not have wrapping, you need to write a condition in the output loop so that every 3 blocks are wrapped in <div class="row"></div>
Approximately it works like this:
after each 3*n block we insert
</div><div class="row">