How to implement such a grid of blocks on bootstrap 4?

Question

css

Friends how to implement such a grid on bootstrap 4? it turns out the grid was made of 4 blocks

<div class="row">
<col-md-3></div>
<col-md-3></div>
<col-md-3></div>
<col-md-3></div>
</div>

The first top boxes can be moved with negative margins margin-top: -50px ; for example
But under them, the blocks of the second row still become in one row exactly, because flex elements. So which is the better option?
Do all blocks with negative margins? Or is there a more efficient one?

Answer 1

https://mdbootstrap.com/docs/jquery/layout/bootstr...