Как реализовать такую сетку блоков на bootstrap 4?

Question

[WebforSelf]

Друзья как реализовать такую сетку на bootstrap 4? получается сетку сделал из 4 блоков

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

Первые верхние блоки можно подвинуть с помощью отрицательных маргинов margin-top: -50px ; например
Но вот под ними блоки второй ряд все равно становятся в один ряд ровно, т.к. флекс элементы же. Поэтому какой лучше вариант?
Все блоки делать с отрицательными маргинами? или есть более действенный?

Comments

[ReaverJS]

Немного не понял в чем сложность. В отступах сверху?

(JS - только генерит блоки)

[WebforSelf]

ReaverJS, Смотрите, отступ сделал, но 2 ряд выравнивается

[WebforSelf]

ReaverJS, все понял, тут просто 4 блока col-md-3
а у меня получается что каждый блок завернут в col-md-3

Answer 1

[Павел Андрейченко]

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

Comments

[WebforSelf]

Не совсем то что нужно, тут блоки будут одинакого размера , просто сдвинуты вверх и вниз на определенный размер.