Skip to content
Elements / Layout

grid

Places children in responsive equal columns. Cards in the same grid row automatically share a height, keeping dashboard panels aligned.

Spec · edit me

No problems. The parser accepted every line.

Result · try itOpen in playground
Tweak the props
min
140
gap
10

Props

minnumberNarrowest a column may be, in pixels (default 200).200
gapnumberSpace between children in pixels (default 14).14
ifconditionShow only when this expression is true, e.g. if=done or if={count>0}. Every element takes it.—
tipstringA short explanation shown on hover, keyboard focus or a tap, e.g. tip="Orders not yet shipped": for a term or a number some people won't know, instead of more words on screen. It makes the element a Tab stop if it isn't one. Every element takes it.—

Children: any elements.

SayShape v0.1 is an early prototype under the MIT License. Status · GitHub