Grid
Component for creating grid layouts. Either rows or columns may be specified.
Basic Example
Card 1
Card 2
Card 3
Card 4
Card 5
Card 6
Card 7
Card 8
Card 9
Card 10
Card 11
Card 12
rx.grid(
rx.foreach(
rx.Var.range(12),
lambda i: rx.card(f"Card {i + 1}", height="10vh"),
),
columns="3",
spacing="4",
width="100%",
)Card 1
Card 2
Card 3
Card 4
Card 5
Card 6
Card 7
Card 8
Card 9
Card 10
Card 11
Card 12
rx.grid(
rx.foreach(
rx.Var.range(12),
lambda i: rx.card(f"Card {i + 1}", height="10vh"),
),
rows="3",
flow="column",
justify="between",
spacing="4",
width="100%",
)API Reference
rx.grid
Component for creating grid layouts.
Test