Masonry

A CSS multi-column masonry grid.

Short

A taller tile with more text inside it here, spanning a couple of lines.

Medium height tile

Tiny

Another block of moderate length to fill the layout.

Last

import { BuiMasonry } from 'ng-blatui';

<div buiMasonry [columns]="3">…tiles…</div>

Two columns

One

A taller tile that wraps across multiple lines of text.

Three

Four

<div buiMasonry [columns]="2" gap="6">…tiles…</div>

Prop	Type	Default	Description
`columns`	`number`	`3`	Maximum number of columns at the widest breakpoint (1-6, responsive).
`gap`	`string`	`'4'`	Spacing between items, as a Tailwind spacing key ('0', '2', '3', '4', '6', '8').

Every ng-blatui component also accepts a class input to merge extra Tailwind classes onto the host.