Boosted Innovation Cup and Masonry
Integrate Masonry with the Boosted Innovation Cup grid system and cards component.
Masonry is not included in Boosted Innovation Cup. Add it by including the JavaScript plugin manually, or using a CDN like so:
<script src="https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
By adding data-masonry='{"percentPosition": true }'
to the .row
wrapper, we can combine the powers of Boosted's responsive grid and Masonry's positioning.
Card title that wraps to a new line
This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Card title
This card has supporting text below as a natural lead-in to additional content.
Last updated 3 mins ago
Card title
This card has a regular title and short paragraph of text below it.
Last updated 3 mins ago
Card title
This is another card with title and supporting text below. This card has some additional content to make it slightly taller overall.
Last updated 3 mins ago