Eu preciso fazer com o grid system se possível o exemplo da imagem:
No exemplo acima, preciso apenas da formatação, onde cada evento é um 'div' com um tamanho dinâmico, e o de baixo cola no de cima como mostra o exemplo. Tentei utilizar o código abaixo para chegar como no exemplo, mas quando atinge o 'col-12' ele quebra a linha e fica tudo 'reto' na mesma linha, ficando desproporcional, ou seja, se fosse no exemplo abaixo, a cada 4 eventos, ficariam todos em uma linha reta.
Abaixo é o código que tentei utilizar para chegar no exemplo abaixo:
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>
<div class="row">
<div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
<div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
<!-- Optional: clear the XS cols if their content doesn't match in height -->
<div class="clearfix visible-xs-block"></div>
<div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
</div>
Obrigado pela ajuda.