Bootstrap e alvenaria

Integre o Masonry com o sistema de grade Bootstrap e o componente de cartões.

A alvenaria não está incluída no Bootstrap. Adicione-o incluindo o plug-in JavaScript manualmente ou usando um CDN assim:


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
  

Ao adicionar data-masonry='{"percentPosition": true }'ao .rowwrapper, podemos combinar os poderes da grade responsiva do Bootstrap e o posicionamento da Masonry.


Placeholder Image cap
Título do cartão que envolve uma nova linha

Este é um cartão mais longo com texto de apoio abaixo como uma introdução natural para conteúdo adicional. Este conteúdo é um pouco mais longo.

Uma citação bem conhecida, contida em um elemento blockquote.

Placeholder Image cap
Título do cartão

Este cartão tem um texto de apoio abaixo como uma introdução natural para conteúdo adicional.

Última atualização 3 minutos atrás

Uma citação bem conhecida, contida em um elemento blockquote.

Título do cartão

Este cartão tem um título regular e um pequeno parágrafo de texto abaixo dele.

Última atualização 3 minutos atrás

Placeholder Card image

Uma citação bem conhecida, contida em um elemento blockquote.

Título do cartão

Este é outro cartão com título e texto de apoio abaixo. Este cartão tem algum conteúdo adicional para torná-lo um pouco mais alto no geral.

Última atualização 3 minutos atrás